cat

dabaicai has a cat

0%

状态管理

  • InheritedWidget

    • 使用

    • ```dart
      class DemoInheritedWidget extends InheritedWidget {
      late ValueNotifier userNotifier;

  DemoInheritedWidget(User user, {Key? key, required Widget child})
      : super(key: key, child: child) {
    userNotifier = ValueNotifier<User>(user);
  }

  /// 主要是用来获取 DemoInheritedWidget
  static DemoInheritedWidget of(BuildContext context) {
    // 不要用 dependOnInheritedWidgetOfExactType
    InheritedElement element =
        context.getElementForInheritedWidgetOfExactType<DemoInheritedWidget>()!;
    return element.widget as DemoInheritedWidget;
  }

  void updateUser(User user) {
    userNotifier.value = user;
  }
  /// 实际上  ValueNotifier 就是对 ChangeNotifier 的一个简单封装
  void updateUserName(String name) {
    userNotifier.value.name = name;
    userNotifier.notifyListeners();
  }

  @override
  bool updateShouldNotify(covariant DemoInheritedWidget oldWidget) {
    return false;
  }
}












class InheritedWidgetDemoPage extends StatefulWidget {
  InheritedWidgetDemoPage({Key? key}) : super(key: key) {
    Logger.e("Page 初始化");
  }

  @override
  _InheritedWidgetDemoPageState createState() =>
      _InheritedWidgetDemoPageState();
}

class _InheritedWidgetDemoPageState extends State<InheritedWidgetDemoPage> {
  @override
  Widget build(BuildContext context) {
    Logger.e("_PageState: build");
    return DemoInheritedWidget(User(name: "张三", age: 18), child: Builder(
      builder: (context) {
        return Scaffold(
          appBar: AppBar(
            title: const Text("InheritedWidgetDemo"),
          ),
          body: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Center(
                child: WidgetA(
                  child: WidgetB(),
                ),
              ),
              MaterialButton(
                color: Colors.blue,
                onPressed: () {
                  DemoInheritedWidget.of(context)
                      .updateUser(User(name: "改变后张三1", age: 19));
                },
                child: const Text(
                  "改变User",
                  style: TextStyle(color: Colors.white),
                ),
              ),
              MaterialButton(
                color: Colors.blue,
                onPressed: () {
                  DemoInheritedWidget.of(context).updateUserName("李四");
                },
                child: const Text(
                  "只改变name",
                  style: TextStyle(color: Colors.white),
                ),
              ),
            ],
          ),
        );
      },
    ));
  }

  @override
  void dispose() {
    Logger.e("_PageState: dispose");
    super.dispose();
  }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93



- Provider

- 使用

- ```dart
class Counter extends ChangeNotifier {
int _count = 0;
int get count => _count;

void increment() {
_count++;

notifyListeners();
}
}






void main() {
runApp(MyApp());
}

class MyApp extends StatelessWidget {

@override
Widget build(BuildContext context) {

return ChangeNotifierProvider(
create: (context) => Counter(),
child: MaterialApp(
title: 'Counter App',
home: HomePage(),
),
);
}
}




`class HomePage extends StatelessWidget {

@override
Widget build(BuildContext context) {

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

return Scaffold(
appBar: AppBar(
title: Text('Counter App'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'Count: ${counter.count}',
style: TextStyle(fontSize: 24),
),
SizedBox(height: 16),
RaisedButton(
onPressed: () {
counter.increment();
},
child: Text('Increment'),
),
],
),
),
);
}
}`



void main() {
runApp(
ChangeNotifierProvider<CounterModel>(
create: (context) => CounterModel(),
child: MyWidget(), ), );
// 使用Provider.listen监听共享数据的变化
Provider.of<CounterModel> (context,listen:false).addListener((counterModel) {
// 在共享数据发生变化时进行相应的操作
print('CounterModel变化了:${counterModel.counter}'
); }); }`


  • final counter = Provider.of(context);当你调用Provider.of方法时,默认情况下它会将listen参数设置为true,这意味着它将尝试在找不到数据模型时监听数据模型的变化,以便在数据发生变化时重新构建相关的部件。

    但是,如果你不希望监听数据模型的变化,可以将listen参数设置为false。这样,当你调用Provider.of(context, listen: false)时,它将返回最近的父级数据模型而不会监听其变化。这对于一些只需要获取数据模型一次而不需要实时监听变化的情况非常有用