首页 > 其他分享 >组件之间的数据共享

组件之间的数据共享

时间:2024-07-05 23:56:53浏览次数:3  
标签:Widget builder child 数据共享 之间 组件 共享 Consumer

文章目录


我们在上一章回中介绍了组件之间共享数据相关的内容,本章回中将继续介绍该内容.闲话休提,让我们一起Talk Flutter吧。

在这里插入图片描述

1. 知识回顾

我们在前面章回中介绍了全局共享数据相关的内容,当时介绍了获取共享数据的三种方法,本章回将介绍其中的一种方法:使用Consumer获取共享数据。

2. 使用方法

Consumer是一个Widget,它提供了builder和child两个属性,我们可以通过builder属性获取到共享数据类型的对象,然后就可以使用共享类型提供的getter方法
获取对象中的共享数据。我们重点介绍Consumer的builder属性,该属性是必选属性,也就是说我们必须它该属性赋值,该属性是方法类型,方法中包含三个参数,方
法返回Widget对象,该方法的函数原型,以及方法中三个参数的详细功能如下:

  final Widget Function(
    BuildContext context,
    T value,
    Widget? child,
  ) builder;
  • context:主要用来创建Widget,为创建Widget提供上下文环境;
  • value:是泛型类型,它用来表示共享数据对象,通过该对象的getter方法可以获取到共享数据;
  • child:表示Consumer组件的子组件,因此它代表的对象和Consumer组件的child属性代表的对象相同;
    介绍完Consumer组件中builder属性的相关内容后,我们通过具体的代码来演示它的使用方法

3. 示例代码

class WidgetB extends StatelessWidget {
  const WidgetB({
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    ///使用consumer共享数据时consumer外层的build不调用,只调用consumer中builder属性对应的方法
    print('builder of Widget B running');
    return Consumer<ViewModel>(
      builder: (context, data, child) {
        print('builder of Consumer of Widget B running');
        if (child != null) {
          ///在这里添加需要更新的widget
          print(' child is not null');
        }
        print('data is: ${data.getData}');
        return Text("Widget B data: ${data._data}");
      },

      ///在这里添加不需要更新的widget,这个child和builder方法中的child一样
      child: Text('childe of consumer'),
    );
  }
}

在上面的代码中,把Consumer组件封装到了一个独立的组件中,一方面可以减少代码的耦合,另一方面可以给builder属性传递BuildContext类型的参数,代码
中相关的地方都添加了注释,我就不详细介绍了,此外代码给Consumer指定了泛型类型:ViewModel。它是共享数据的类型,详细的定义可以参数前面章回的示例代码。

4. 经验分享

Consumer组件在实际项目中使用比较多,因为它的性能比Provider组件好一些,比如上面代码中如果共享数据有变化,那么Consumer组件所在的组件WidgetB不会
更新,也就是说WidgetB的build()方法不会被回调,回调的是Consumer组件builder属性对应的方法。

我们介绍的Consumer组件只能共享一种类型的数据,我们还可以使用Consumer2,Consumer3组件来共享2种,3种类型的数据,我们在这里就不介绍了,它们的用法
相似,大家可以自己动手去实践。

看官们,关于"全局共享数据之Consumer"相关的内容就介绍到这里,欢迎大家在评论区交流与讨论!

标签:Widget,builder,child,数据共享,之间,组件,共享,Consumer
From: https://blog.csdn.net/talk_8/article/details/140215712

相关文章

  • SpringBoot, Maven, Apache 之间的关系,SpringBoot 简介
    SpringBoot是什么?SpringBoot是一种基于Spring框架的开源框架,用于快速创建独立的、生产级别的Spring应用程序。SpringBoot可以自动配置大部分Spring应用程序所需的常见功能和库,从而减少了开发人员的工作量和时间。SpringBoot提供了一种“约定优于配置”的方式,使得开发人员可......
  • 进程、程序、应用程序之间的关系
    文章目录进程和程序进程和应用程序总结参考资料进程和程序程序:程序是存放在硬盘中的可执行文件,主要包括代码指令和数据。程序本身是一个静态的文件,只有在被操作系统加载到内存中并执行时才会变成进程。进程:进程是程序在操作系统中的执行实例。一个进程是一个程序......
  • NO.04 Altium Designer组件参数类型
    提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档@TOCAltiumDesigner组件参数类型前言○由于“BOM、ActiveBOM或Draftsman必须与设计中的组件一致”因此无法直接进行删除BOM、ActiveBOM或Draftsman“其中一项;○不过可以通过设置组件“参数”类型......
  • 并发、多线程和HTTP连接之间有什么关系?
    一、并发的概念 并发是系统同时处理多个任务或事件的能力。在计算中,这意味着系统能够在同一时间段内处理多个任务,而不是严格按照顺序一个接一个地执行它们。并发提高了系统的效率和资源利用率,从而更好地满足用户的需求。在现代应用程序中,用户可能会同时执行多个操作,例如同时......
  • 【Unity几种数据存储之间的区别】PlayerPrefs、Json、XML、二进制、SQLite数据存储之
    ......
  • BOSHIDA DC/AC电源模块在不同的电源类型之间进行转换
    BOSHIDADC/AC电源模块在不同的电源类型之间进行转换电力转换是现代社会不可或缺的一部分,它使我们能够在不同的电源类型之间进行转换,从而满足各种设备和应用的需求。DC/AC电源模块是一种用于将直流电转换为交流电的设备,它在电子设备、太阳能系统、电池充电等领域发挥着重要的作用......
  • Laravel 宏指令(Macro)动态添加自定义方法到Laravel的核心组件中
    Laravel宏指令(Macro)在Laravel中,宏指令(Macro)是一种灵活的方式,允许您动态添加自定义方法到Laravel的核心组件中,如模型、查询构建器、集合等,以便在不改变核心代码的情况下扩展框架的功能。通过宏指令,您可以向Laravel内置的类添加自定义方法,实现更高级的功能和逻辑。福利彩......
  • vue3 父子组件双向绑定
    父组件ParentComponent.vue<!--ParentComponent.vue--><template><div>子组件输入的数据<p>ParentValue:{{parentValue}}</p>父输入框<inputv-model="parentValue"><CustomInputv-model="par......
  • AntDesign上传组件upload二次封装+全局上传hook使用
    文章目录前言a-upload组件二次封装1.功能分析2.代码+详细注释3.使用到的全局上传hook代码4.使用方式5.效果展示总结前言在项目中,ant-design是我们常用的UI库之一,今天就来二次封装常用的组件a-upload批量上传组件,让它用起来更方便。a-upload组件二次封装1.......
  • 1小时完成应用程序健康检查组件
    一、一个故事(虽然没有事故)某天运维的同学通知我,云服务集群要加一台机器,过程是从当前线上集群中克隆一份服务器镜像,启动并加入集群,由于应用依赖的数据库服务器设置了白名单,新加的服务器需要加入白名单,悲剧的是,运维同学并不知道应用依赖了哪些数据库。运维同学只好登录服务器,检查......