flutter - 如何在 Flutter 中使用 Provider 添加依赖注入

问题描述

void main() => runApp(MultiProvider(providers: [
      ChangeNotifierProvider(
        create: (BuildContext context) => QuoteViewModel(),
      ),
      ChangeNotifierProvider(
        create: (BuildContext context) => AuthorViewModel(),
      ),
    ], child: MyApp()));

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

主要.dart

class QuoteListPage extends StatefulWidget {
  @override
  _QuoteListPageState createState() => _QuoteListPageState();
}

class _QuoteListPageState extends State<QuoteListPage> {
  @override
  Widget build(BuildContext context) {
    final model = Provider.of<QuoteViewModel>(context);
    return Scaffold(
      appBar: AppBar(title: Text('Poems List')),
      body: _buildBody(model.getQuotes()),
    );
  }

  Widget _buildBody(List<Quote> quotes) => ListView(
        children: quotes
            .map((quote) => ListTile(
                  title: Text(quote.body),
                ))
            .toList(),
      );
}

引用列表页面.dart

class Quote {
  final String id;
  final String authorId;
  final String body;

  Quote(this.id, this.authorId, this.body);
}

class Author {
  final String id;
  final String name;

  Author(this.id, this.name);
}

模型.dart

class Repository {
  final Api _api = Api();
  final Database _database = Api();

  List<Quote> getQuotes() => [];

  List<Author> getAuthors() => [];
}

存储库.dart

class QuoteViewModel with ChangeNotifier {
  final Repository _repository = Repository();

  List<Quote> getQuotes() => _repository.getQuotes();
}

class AuthorViewModel with ChangeNotifier {
  final Repository _repository = Repository();

  List<Author> getAuthors() => _repository.getAuthors();
}

通知器.dart

在阅读Medium上的一篇文章后，我曾尝试使用ProxyProvider ，但它以错误“这可能是一个错误，因为提供者不会自动更新依赖项”而结束

List<SingleChildWidget> globalProviders = [
  Provider.value(value: Api()),
  Provider.value(value: Database()),
  ProxyProvider2<Api, Database, Repository>(
    update: (_, api, database, __) => Repository(api, database),
  ),
  ProxyProvider<Repository, QuoteViewModel>(
    update: (_, repo, __) => QuoteViewModel(repo),
  ),
  ProxyProvider<Repository, AuthorViewModel>(
    update: (_, repo, __) => AuthorViewModel(repo),
  )
];

void main() => runApp(
      MultiProvider(
        providers: globalProviders,
        child: MyApp(),
      ),
    );

main.dart（更新）

class Repository {
  final Api _api;
  final Database _database;

  Repository({@required api, @required database})
      : _api = api,
        _database = database;

  List<Quote> getQuotes() => [];

  List<Author> getAuthors() => [];
}

repository.dart（更新）

class QuoteViewModel with ChangeNotifier {
  final Repository _repository;

  QuoteViewModel({@required repository}) : _repository = repository;

  List<Quote> getQuotes() => _repository.getQuotes();
}

class AuthorViewModel with ChangeNotifier {
  final Repository _repository;

  AuthorViewModel({@required repository}) : _repository = repository;

  List<Author> getAuthors() => _repository.getAuthors();
}

notifiers.dart（更新）

标签： flutterdartdependency-injectionarchitectureprovider

flutter - 如何在 Flutter 中使用 Provider 添加依赖注入

问题描述

在阅读Medium上的一篇文章后，我曾尝试使用ProxyProvider ，但它以错误“这可能是一个错误，因为提供者不会自动更新依赖项”而结束

解决方案

推荐阅读