flutter Provide 狀態管理篇

Provide是Google官方推出的狀態管理模式。官方地址爲：

https://github.com/google/flutter-provide

 

如今Flutter的狀態管理方案不少，redux、bloc、state、Provide。

• Scoped Model : 最先的狀態管理方案，我剛學Flutter的時候就使用的這個，雖然還有公司在用，可是大部分已經選用其它方案了。

• Redux：如今國內用的最多，由於鹹魚團隊一直在用，還出了本身fish redux。阿里宣佈開源Flutter應用框架Fish Redux！

• bloc：比Redux簡單，並且好用，特別是一個頁面裏的狀態管理。

• state：缺點是耦合太強，若是是大型應用，管理起來很是混亂。

• Provide：是在Google的Github下的一個項目，剛出現不久，因此能夠推測他是Google的親兒子。

步驟：

1. 添加依賴

2. 建立狀態管理dart文件

import 'package:flutter/material.dart';

class  Counter with ChangeNotifier {
  int value = 0;
  increment() {
    value++;
    notifyListeners();
  }
}

3. 將狀態放入頂層

void main() {
  var counter =Counter();
  var providers = Providers();

  //將counter對象添加進providers
  providers..provide(Provider<Counter>.value(counter));

  runApp(
    ProviderNode(
      child: MyApp(),
      providers: providers,
    )
  );
}

Provider<Counter>.value將counter包裝成了_ValueProvider。並在它的內部提供了StreamController從而實現對數據進行流式操做。

4. 獲取狀態

　　一樣的Provide也提供了兩種獲取State的方法。咱們先來介紹第一種，經過Provide小部件獲取。

class Number extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.only(top: 200.0),
      child: Provide<Counter>(
        builder: (context, child,counter) {
          return Text('${counter.value}',style: TextStyle(fontSize: 30.0),);
        },
      )
    );
  }
}

builder方法接收三個參數

• 第一個參數context：表明上下文。
• 第二個參數child：假如這個小部件足夠複雜，內部有一些小部件是不會改變的，那麼咱們能夠將這部分小部件寫在Provide的child屬性中，讓builder再也不重複建立這些小部件，以提高性能。
• 第三個參數counter：這個參數表明了咱們獲取的頂層providers中的狀態。

第二種獲取方式：Provide.value<T>(context)

final currentCounter = Provide.value<Counter>(context);

5. 修改狀態

Widget build(BuildContext context) {
    return Container(
      child: Container(
        child: RaisedButton(
          onPressed: () {
            Provide.value<Counter>(context).increment();
          },
          child: Text('增長'),
        ),
      ),
    );
  }

 

獲取數據流

可參考　　http://www.javashuo.com/article/p-ptxclzze-ct.html