Flutter依赖注入插件flutter_injections的使用

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

Flutter依赖注入插件flutter_injections的使用

Flutter Injections

Flutter Injections 是一个帮助您在项目中管理任何依赖项的插件，无需使用上下文，并且使模块能够创建依赖项。其目标是通过简单的易用的API来帮助任何开发人员管理依赖项。

学习更多

有关详细信息，请参阅 文档。

为什么使用 Flutter Injections？

  • 快速高效

    • Flutter Injections 使用搜索树来获取依赖项，这提高了获取它们的速度，并减少了CPU搜索特定对象所需的资源。

  • 模块注入

    • 创建包含所有所需依赖项的模块注入。例如，HomeInjections 包含 HomePage 所需的所有依赖项。

  • 易于使用

    • 重点在于保持处理大型应用中的依赖项的简单性。

  • 自动销毁

    • 当从 Widget 树中移除 FlutterInjection 时，对象会自动销毁。

  • 简单销毁

    • 使用 __dispose<T> 方法可以销毁特定对象。

如何使用

使用 Flutter Injections 非常简单，只需三个步骤：

  1. 添加 FlutterInjections 到 pubspec.yaml 文件中：
flutter_injections: ^any # 或当前版本
  1. 在需要的地方创建您的 FlutterInjections：
class YourPageInjections extends StatelessWidget {
  const YourPageInjections({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return FlutterInjectionsWidget(
      injections: [
        Inject<YourRepository>((i) =&gt; YourRepository(client: i.find&lt;Dio&gt;())),
        Inject<YourController>(
          (i) =&gt; YourController(repository: i.find&lt;YourRepository&gt;()),
        ),
      ],
      builder: (_) =&gt; const YourPage(),
    );
  }
}

或者您可以继承新的 widget FlutterModule 来添加依赖项：

class YourModule extends FlutterModule {
  const YourModule({Key? key}) : super(key: key);

  @override
  Widget get child =&gt; const YourPage();

  @override
  List&lt;Inject&lt;Object&gt;&gt; get injections =&gt; [
    Inject&lt;YourRepository>((i) =&gt; YourRepository(client: i.find&lt;Dio&gt;())),
    Inject&lt;YourController>(
      (i) =&gt; YourController(repository: i.find&lt;YourRepository&gt;()),
    ),
  ];
}
  1. 最后，使用它来获取依赖项：
final controller = FlutterInjections.get&lt;YourController&gt;();

贡献者

成为贡献者吧！

贡献者

感谢 contrib.rocks 的支持。

示例代码

import 'package:example/app_module.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const AppModule());
}

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

Harmonyos Next教程
1 回复

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


当然，下面是一个关于如何使用Flutter依赖注入插件flutter_injections的代码案例。这个插件允许你在Flutter应用中更轻松地管理依赖项。

首先，确保你已经在pubspec.yaml文件中添加了flutter_injections依赖：

dependencies:
  flutter:
    sdk: flutter
  flutter_injections: ^x.y.z  # 请替换为最新版本号

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

1. 定义依赖项

首先，你需要定义一些依赖项。这些依赖项通常是一些服务或管理类。

// services/api_service.dart
import 'package:dio/dio.dart';
import 'package:flutter_injections/flutter_injections.dart';

@Injectable()
class ApiService {
  final Dio dio;

  ApiService(this.dio);

  Future<String> fetchData() async {
    Response response = await dio.get('https://api.example.com/data');
    return response.data;
  }
}

2. 配置依赖注入

在你的应用入口文件（通常是main.dart）中配置依赖注入。

// main.dart
import 'package:flutter/material.dart';
import 'package:flutter_injections/flutter_injections.dart';
import 'services/api_service.dart';
import 'package:dio/dio.dart';

void main() {
  // 初始化依赖注入容器
  setupLocator();
  runApp(MyApp());
}

void setupLocator() {
  locator.registerLazySingleton<Dio>(() => Dio());
  locator.registerLazySingleton<ApiService>(() => ApiService(locator<Dio>()));
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

3. 使用依赖项

现在，你可以在任何地方通过locator来获取依赖项。

// pages/home_page.dart
import 'package:flutter/material.dart';
import 'package:flutter_injections/flutter_injections.dart';
import 'services/api_service.dart';

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  ApiService _apiService;
  String _data = '';

  @override
  void initState() {
    super.initState();
    _apiService = locator<ApiService>();
    _fetchData();
  }

  Future<void> _fetchData() async {
    String data = await _apiService.fetchData();
    setState(() {
      _data = data;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Demo Home Page'),
      ),
      body: Center(
        child: Text('Data: $_data'),
      ),
    );
  }
}

总结

以上代码展示了如何使用flutter_injections插件进行依赖注入。首先，定义依赖项并使用@Injectable()注解标记它们。然后，在应用的入口文件中配置依赖注入容器。最后，在需要使用依赖项的地方通过locator获取它们。

这种方式有助于减少代码中的依赖项传递，使得代码更加简洁和模块化。

回到顶部