Flutter依赖注入使用指南

1. 手动依赖注入

最简单的方式,通过构造函数传递依赖:

Dart 复制代码
class ApiService {
  Future<String> fetchData() async {
    // API 调用
    return 'Data';
  }
}

class UserRepository {
  final ApiService apiService;
  
  UserRepository(this.apiService);
  
  Future<String> getUserData() {
    return apiService.fetchData();
  }
}

class MyWidget extends StatelessWidget {
  final UserRepository userRepository;
  
  MyWidget({required this.userRepository});
  
  @override
  Widget build(BuildContext context) {
    return Text('User: ${userRepository.getUserData()}');
  }
}

// 使用
void main() {
  final apiService = ApiService();
  final userRepository = UserRepository(apiService);
  runApp(MyApp(userRepository: userRepository));
}

2. 使用 Provider 包

最流行的 Flutter 状态管理和依赖注入方案:

Dart 复制代码
dependencies:
  provider: ^6.0.5
Dart 复制代码
import 'package:provider/provider.dart';

// 定义服务类
class CounterService {
  int _count = 0;
  int get count => _count;
  
  void increment() {
    _count++;
  }
}

void main() {
  runApp(
    MultiProvider(
      providers: [
        Provider<CounterService>(create: (_) => CounterService()),
        // 可以添加更多 provider
      ],
      child: MyApp(),
    ),
  );
}

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

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final counterService = Provider.of<CounterService>(context);
    
    return Scaffold(
      body: Center(
        child: Text('Count: ${counterService.count}'),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          counterService.increment();
        },
        child: Icon(Icons.add),
      ),
    );
  }
}

依赖注入是将对象的创建和使用分离,使代码更加灵活、可测试和可维护

相关推荐
西西学代码19 小时前
Flutter---侧边栏
flutter
xmdy586620 小时前
Flutter+开源鸿蒙实战|企业级工具APP Day2 全局网络封装与 Dio 拦截器实战(鸿蒙兼容版)
flutter·开源·harmonyos
xmdy586621 小时前
Flutter+开源鸿蒙实战:企业级工具类APP开发教程(含第三方库适配)
flutter·开源·harmonyos
Swift社区21 小时前
Flutter / React / ArkUI:在鸿蒙 PC 上怎么选?
flutter·react.js·harmonyos
恋猫de小郭1 天前
Android Studio 放着没怎么用,怎么也会越来越卡?
android·前端·flutter
xmdy58662 天前
Flutter + 开源鸿蒙跨端实战|基于空间地理信息的**城市全域智慧泊车调度与多维运维管理平台** Day1 项目架构基座与工程化环境搭建
flutter·开源·harmonyos
KillerNoBlood2 天前
2026移动端跨平台开发面经总结
android·算法·flutter·ios·移动开发·鸿蒙·kmp
xmdy58662 天前
Flutter+开源鸿蒙全域智慧泊车调度管理平台 Day4 订单全流程闭环+支付核验+会员权益+个人中心开发
flutter·开源·harmonyos
W蘭2 天前
Flutter从入门到实战-01-Dart语言基础
flutter
xuankuxiaoyao2 天前
Vue.js 插槽、作用域插槽、商品、阶段案例
android·vue.js·flutter