flutter实用系列（一）之状态管理provide的超简单demo

业务流程图

简单的业务流程图，如果有用过vuex，都是类似的东西，换汤不换药

如何使用

1、引入provide依赖
2、新建状态仓库
3、触发状态改变
4、页面引用创库变量

● 引入provide依赖

● 新建状态仓库
在lib目录下新建provide文件夹，在provide文件夹下新建创库文件counter.dart

import 'package:flutter/material.dart';

class Counter with ChangeNotifier{
    int value = 0;

    add(){
        value++;
        notifyListeners();        //通知引用该变量地方的改变值
    }
    subtract(){
        value--;
        notifyListeners();        //通知引用该变量地方的改变值
    }
}

●触发状态改变和页面引用

import 'package:flutter/material.dart';
import 'package:provide/provide.dart';
import './provide/counter.dart';

void main(){
    //main函数里面引用provide
    var counter = Counter();
    var providers =Providers();
    providers..provide(Provider<Counter>.value(counter));
    runApp(ProviderNode(child: MyApp(),providers: providers,));
}

class MyApp extends StatelessWidget{
    @override
    Widget build(BuildContext context){
        return MaterialApp(
            title: "flutter provide",
            home: Scaffold(
                appBar: AppBar(
                    title: Text("flutter provide"),
                ),
                body: Container(
                    child:Column(
                        children: <Widget>[
                            GetProvideValue(),
                            AddButton(),
                            SubButton(),
                        ],
                    )
                ),
            ),
        );
    }
}
//获取provide状态里面的值
class GetProvideValue extends StatelessWidget{
    @override
    Widget build(BuildContext context){
        return Container(
            child: Provide<Counter>(                        //在其他页面也是用同样的方法可以引用到provide里面的参数
                    builder: (context,child,counter){
                        return Text(
                            "${counter.value}"
                        );
                    },
                ),
        );
    }
}
//改变provide状态的值,调用provide里面的方法
class AddButton extends StatelessWidget{
    @override
    Widget build(BuildContext context){
        return RaisedButton(
            onPressed: (){
                Provide.value<Counter>(context).add();
            },
            child: Text("增加"),
        );
    }
}
//改变provide状态的值,调用provide里面的方法
class SubButton extends StatelessWidget{
    @override
    Widget build(BuildContext context){
        return RaisedButton(
            onPressed: (){
                Provide.value<Counter>(context).subtract();
            },
             child: Text("减少"),
        );
    }
}

新建完项目，直接把上面2段代码复制就可以运行了