Flutter依赖注入插件syringe的使用

发布于 1周前 作者 yibo5220 来自 Flutter

Flutter依赖注入插件syringe的使用

Syringe 是一个用于 Dart 应用程序的依赖注入(DI)库。

特性

  • 依赖注入:通过灵活且直观的 API 管理 Dart 应用程序中的依赖关系。
  • 服务定位器:利用服务定位器模式创建和解析具有依赖关系的对象。
  • 模块可见性:将依赖关系组织到模块中,并设置可自定义的可见性设置。
  • 循环依赖检测:检测并防止循环依赖,确保应用程序的稳定性。
  • 可测试的代码:通过解耦组件和模拟依赖项提高代码库的可测试性。

安装

要在 Dart 项目中使用 Syringe,请将其添加到 pubspec.yaml 文件中:

dependencies:
  syringe: ^0.9.7-pre

然后运行 dart pub get 来安装包。

使用

以下是一个完整的示例代码,演示如何使用 Syringe 进行依赖注入:

import 'dart:async';

import 'package:syringe/syringe.dart';

Future<void> main() async {
  // 定义用于依赖注入的模块。
  final modules = <Module>[
    ExportModule<Foo>(
      // 使用 ExportModule 定义 Foo 的工厂方法。
      onInject: (deps) => Foo(bar: deps<Bar>()),
      dependencies: [Bar], // Foo 所需的依赖项。
    ),
    BarModule(), // 创建 Bar 实例的模块。
  ];

  // 创建一个注入器实例。
  final injector = Injector<Dependency>(
    modules: modules, // 要注入的模块列表。
    onProgress: (info) {
      // 回调以跟踪注入进度。
      if (info.phase == ProgressPhase.done) {
        final total = info.total;
        final type = info.type;
        final current = info.current;
        final percent = info.percent;
        final percentStr = percent.toString().padLeft(3);
        final internalStr = info.export ? 'export' : '';

        // 打印进度信息。
        print('[$percentStr %] $current of $total ($type) $internalStr');
      }
    },
    onInject: Dependency.onInject, // 回调以创建 Dependency 实例。
  );

  // 执行依赖注入并等待结果。
  final dependency = await injector.inject();

  // 打印与 Foo 关联的 Bar 实例的标题。
  print(dependency.foo.bar.title);
}

/// 表示一个依赖项的类。
class Dependency {
  final Foo foo;

  /// 创建 Dependency 实例的工厂方法。
  static Dependency onInject(DepsCallback deps) {
    return Dependency(foo: deps<Foo>());
  }

  const Dependency({required this.foo});
}

/// 表示一个 Bar 实例的类。
class Bar {
  final String title;

  Bar({required this.title});
}

/// 表示一个 Foo 实例的类。
class Foo {
  final Bar bar;

  const Foo({required this.bar});
}

/// 创建 Bar 实例的模块。
final class BarModule extends Module<Bar> {
  const BarModule();

  [@override](/user/override)
  FutureOr<Bar> factory(deps) async {
    // 在创建 Bar 实例前模拟延迟。
    await Future.delayed(Duration(seconds: 1));
    return Bar(title: 'Hello World');
  }

  [@override](/user/override)
  bool get export => false;
}

更多关于Flutter依赖注入插件syringe的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter依赖注入插件syringe的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是如何在Flutter项目中使用syringe插件进行依赖注入的一个简单示例。syringe是一个轻量级的依赖注入库,适用于Flutter和Dart项目。

步骤 1: 添加依赖

首先,在你的pubspec.yaml文件中添加syringe依赖:

dependencies:
  flutter:
    sdk: flutter
  syringe: ^最新版本号  # 请替换为最新的版本号

然后运行flutter pub get来安装依赖。

步骤 2: 定义服务

接下来,定义你将要注入的服务。例如,我们定义一个简单的UserService

class UserService {
  String getUserName() {
    return 'John Doe';
  }
}

步骤 3: 配置依赖注入容器

在你的应用入口文件(通常是main.dart)中,配置syringe容器并注册服务:

import 'package:flutter/material.dart';
import 'package:syringe/syringe.dart';
import 'user_service.dart';

void main() {
  // 创建一个依赖注入容器
  final container = Container();

  // 注册服务
  container.registerSingleton<UserService>(UserService());

  // 使用Builder包裹MaterialApp以提供container
  runApp(Builder(
    builder: (context) {
      // 将container提供给应用的上下文
      final injector = InjectorProvider(
        container: container,
        child: MyApp(),
      );
      return injector;
    },
  ));
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomeScreen(),
    );
  }
}

步骤 4: 在组件中使用注入的服务

在你的组件中,使用Injector来获取注入的服务。例如,在HomeScreen组件中:

import 'package:flutter/material.dart';
import 'package:syringe/syringe.dart';
import 'user_service.dart';

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // 获取UserService实例
    final userService = Injector.of<UserService>(context);

    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Syringe Demo'),
      ),
      body: Center(
        child: Text('User Name: ${userService.getUserName()}'),
      ),
    );
  }
}

完整代码示例

以下是所有代码片段整合在一起的完整示例:

// main.dart
import 'package:flutter/material.dart';
import 'package:syringe/syringe.dart';
import 'user_service.dart';

void main() {
  final container = Container();
  container.registerSingleton<UserService>(UserService());

  runApp(Builder(
    builder: (context) {
      final injector = InjectorProvider(
        container: container,
        child: MyApp(),
      );
      return injector;
    },
  ));
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomeScreen(),
    );
  }
}

// user_service.dart
class UserService {
  String getUserName() {
    return 'John Doe';
  }
}

// home_screen.dart
import 'package:flutter/material.dart';
import 'package:syringe/syringe.dart';
import 'user_service.dart';

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final userService = Injector.of<UserService>(context);

    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Syringe Demo'),
      ),
      body: Center(
        child: Text('User Name: ${userService.getUserName()}'),
      ),
    );
  }
}

以上代码展示了如何在Flutter项目中使用syringe插件进行依赖注入。你可以根据需要扩展这个示例,注册更多的服务并在不同的组件中使用它们。

回到顶部