Flutter入门

女爷i 2023-10-05 06:27 43阅读 0赞

## Flutter中Provide使用 ##

#### 第一步 ####

//创建Provide第一步,混入一个ChangeNotifier,调用notifyListeners();方法通知所有监听器数据已经改变
    class Counter with ChangeNotifier {
        
      int value = 0;
    
      void increment() {
        
        value++;
        notifyListeners();
      }
    }

#### 第二步 ####

//在入口声明Provider,没有声明无法使用
    void main() {
        
      var providers = Providers();
      var counter = Counter();
      providers..provide(Provider<Counter>.value(counter)); //两个点代表构建者模式
      //修改runApp的模式
      runApp(ProviderNode(child: MyApp(), providers: providers));
    }

#### 第三步,存储数据 ####

class MyButton extends StatelessWidget {
        
      @override
      Widget build(BuildContext context) {
        
        return Container(
          child: RaisedButton(
            onPressed: (){
        
              Provide.value<Counter>(context).increment();
            },
            child: Text('递增'),
          ),
        );
      }
    }

#### 第四步,展示数据 ####

class Number extends StatelessWidget {
        
      @override
      Widget build(BuildContext context) {
        
        return Container(
          margin: EdgeInsets.only(top: 300),
          child: Provide<Counter>(
            builder: (context,child,counter){
        
              return Text("${counter.value}");
            },
          ),
        );
      }
    }

发表评论取消回复

表情：

评论列表（有 0 条评论，43人围观）

还没有评论，来说两句吧...

相关阅读

相关 "Flutter基础（十）布局Widget快速入门

**本文首发于公众号「刘望舒」** [ReactNative入门系列][ReactNative] [React Native组件][React Native] [Fl...

柔情只为你懂/ 2024年04月17日 06:31/ 0 赞/ 99 阅读

相关 Flutter 开发入门文章汇总

官网文档很详细，搭建环境和学习组件基本可以参考 [官网文档][Link 1] 上拉加载和下拉刷新 [Flutter 上拉加载和下拉刷新 - 掘金][Flutt

待我称王封你为后i/ 2024年02月17日 11:02/ 0 赞/ 21 阅读

相关 Flutter入门

Flutter中Provide使用第一步 //创建Provide第一步,混入一个ChangeNotifier,调用notifyListeners();方法

女爷i/ 2023年10月05日 06:27/ 0 赞/ 44 阅读

相关 flutter入门setState()方法解析

![20200729223615655.png][] 1、创建一个状态可变的Stateful Widget需要两个类，分别继承自StateFulWidget和State

àì夳堔傛蜴生んèń/ 2023年03月02日 14:59/ 0 赞/ 32 阅读

相关 Flutter Canvas绘制快速入门

Flutter是Google的UI框架，所以绘制也秉承了Android的那套东西，坐标起点是从左上角开始的，API也非常相似，对Android开发者特别的友好。 Custo

亦凉/ 2022年09月13日 04:26/ 0 赞/ 209 阅读

相关 Flutter 入门指南之 Dart 语言基础

一、基础篇 1.1 Dart 语言的优势 Dart 语言的优势 1、支持 AOT 编译和 JIT 编译两种方式 2、Dart 为单线程，不允许抢占。 TODO

旧城等待，/ 2022年08月28日 09:56/ 0 赞/ 244 阅读

相关 Flutter必备——Dart入门（上）

文章目录变量默认值可选的类型 final以及const

蔚落/ 2022年04月25日 09:08/ 0 赞/ 376 阅读

相关 Flutter必备——Dart入门（下）

文章目录类实例变量构造方法默认构造方法

蔚落/ 2022年01月22日 22:17/ 0 赞/ 376 阅读

相关 Flutter入门进阶之旅（十二）Flutter 数据存储

前言 > 之前的章节我们基本上把Flutter中基础部分的东西都做了简单的讲解，通过前面章节的循序学习读者也基本能完成一些简单的UI绘制并能利用Flutter处理一些简单

水深无声/ 2022年01月20日 09:47/ 0 赞/ 755 阅读

相关 Flutter入门(1)—环境配置

环境配置一、获取Flutter SDK 1、去flutter官网下载其最新可用的安装包，[转到下载页][Link 1] 2、将flutterSDK进行解压

我不是女神ヾ/ 2021年09月03日 09:42/ 0 赞/ 438 阅读