一、单状态共享

定义可以修改的模型:
    使用mixin(with ChangeNotifier),在数据修改后,调用notifyListeners()通知观众刷新。

class CounterModel with ChangeNotifier {
  int _count = 10;
  int get counter => _count;
  void increment(){
    _count++;
    notifyListeners();
  }
}

 数据资源挂载,可以使用下面的方法,把数据模型挂载到需要访问数据的Widget的外面。

Widget build(BuildContext context) {
    //此处也可以加上类型ChangeNotifierProvider<CounterModel>
    return ChangeNotifierProvider(
      create: (_)=>CounterModel(),
      child: ...

注意4.0开始,创建新的shuju使用create。3.0的使用使用value。

访问数据模型,使用以下方法取出模型对象,就可以访问模型对象的属性和方法了。

final counter = Provider.of<CounterModel>(context);

二、代理数据模型

有时候我们需要根据以后的数据模型,进行数据处理或转换后才能使用。就可以使用ProxyProvider来达到目的。

定义新的数据模型

class MyTranslation {
  int _value = 0;
  MyTranslation(this._value);

  String get title => "you clicked $_value times.";
}

挂载数据模型

ProxyProvider<CounterModel,  MyTranslation>(
   // 这里的第三个参数(result)是MyTranslation还没有更新之前的数据
   update: (context, counter, result,) {
       // 在这里对来源数据(CounterModel)进行处理,生成新的目标数据(MyTranslation)
       return MyTranslation(counter.counter*2);
   },
)

等价于下面的写法

 ProxyProvider0<MyTranslation>(
     update: (context, result) {
        final counter = Provider.of<CounterModel>(context);
        return MyTranslation(counter.counter*2);
     },
)

使用数据

final _mytrans = Provider.of<MyTranslation>(context);

三、多数据模型

模型定义和数据访问和上面的一致,只是在挂载数据时,需要使用MultiProvider。

  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        ChangeNotifierProvider(create: (_)=>CounterModel()),
        ProxyProvider<CounterModel,  MyTranslation>(
          // 这里的第三个参数(result)是MyTranslation还没有更新之前的数据
          update: (context, counter, result,) {
            // 在这里对来源数据(CounterModel)进行处理,生成新的目标数据(MyTranslation)
            return MyTranslation(counter.counter*2);
          },
        )
      ],
      child: ...

 

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐