如何在 Flutter 中添加多个相同类型的 ChangeNotifierProvider

Posted

技术标签:

【中文标题】如何在 Flutter 中添加多个相同类型的 ChangeNotifierProvider【英文标题】:how to add multiple ChangeNotifierProvider in same type in Flutter 【发布时间】:2020-07-18 00:40:16 【问题描述】:

是否可以同时添加多个ChangeNotifierProvider?

return MultiProvider(
  providers: [
      ChangeNotifierProvider<ValueNotifier<double>>(
        create: (_) => ValueNotifier<double>(0.0),
      ),
      ChangeNotifierProvider<ValueNotifier<double>>(
        create: (_) => ValueNotifier<double>(0.0),
      ),
  ],

在我的构建方法中

 @override
  Widget build(BuildContext context) 
    ValueNotifier<double> firstNotifier = Provider.of(context, listen: true);
    ValueNotifier<double> secondNotifier = Provider.of(context, listen: true);

  print('First value $firstNotifier.value Second value $secondNotifier.value');

 ...
 onTap:()
   firstNotifier.value = 10.0;
   secondNotifier.value = 30.0;
 

两个打印值相同 第一个值为 10 第二个值为 10

【问题讨论】:

【参考方案1】:

不可能这样做。您必须提供不同类型的提供程序才能获得正确的值。

如果您多次使用同一个提供者,那么它将为您提供小部件树中最近提供者值的值。

他们的官方文档中也提到了。

在这里查看。 Can I obtain two different providers using the same type?

【讨论】:

【参考方案2】:

有一种优雅的方法可以做到这一点,但我们必须创建两个单独的类来扩展 changeNotifierProvider

class FirstNotifier with ChangeNotifier
  double value=0; //default
  void ChangeValue(double newValue)
    value=newValue
    notifyListeners();
  

第二个通知器为 ;

class SecondNotifier with ChangeNotifier
  double value=0; //default
  void ChangeValue(double newValue)
    value=newValue
    notifyListeners();
  

然后在您的构建方法中,您可以访问它们

final firstNotifier = Provider.of<FirstNotifier>(context, listen:true)
final secondNotifier = Provider.of<SecondNotifier>(context, listen:true)

然后你可以将它们更改为

firstNotifier.ChangeValue(30); 

在 MultiProvider 代码中,您可以将 Providers 包装为

return MultiProvider(
  providers: [
      ChangeNotifierProvider<FirstNotifier>(
        create: (_) => FirstNotifier,
      ),
      ChangeNotifierProvider<SecondNotifier >(
        create: (_) => SecondNotifier ,
      ),
  ],

这样就可以了

【讨论】:

以上是关于如何在 Flutter 中添加多个相同类型的 ChangeNotifierProvider的主要内容,如果未能解决你的问题,请参考以下文章

使用相同名称时如何避免覆盖列表项?

如何在 Flutter 中的行小部件内的容器上添加边框?

Flutter:多个小部件使用相同的 GlobalKey

如何在flutter中添加密码输入类型使密码用户输入不可见,就像Android Native EditText的inputtype:密码一样?

使用flutter如何在同一个App中使用多个firebase实时数据库

添加多个相同类型的子表单