【问题标题】:How to read store values outside of the render tree in Flutter如何在 Flutter 中读取渲染树之外的存储值
【发布时间】:2021-03-05 02:44:14
【问题描述】:

我正在学习 Flutter 并尝试与 redux 集成以进行商店管理。

我看到商店的所有示例都是在小部件的渲染部分访问的,例如这样:

Padding(
  padding: EdgeInsets.all(2.0),
  child: StoreConnector<AppState, List<Photo>>(
        converter: (store) => store.state.photos,
        builder: (_, photos) {
          return GridView.builder(
            itemCount: photos.length,
            itemBuilder: (BuildContext context, int index) {
              final photoUrl = photos[index].portrait;
              return Padding(
                padding: EdgeInsets.all(1.0),
                child: new Image.network(
                  photoUrl,
                  fit: BoxFit.cover,
                ),
              );
            },
            gridDelegate:                                    
            // .......

但是如何从 initState 中的存储中获取一个值,并检测该值是否发生变化,例如?我可以在渲染树之外为某个值设置一个监听器吗?

谢谢。

为清楚起见进行编辑,我正在寻找的是一些 Flutter 等效于 react 的 useSelector 能够获得 useEffect 值的变化

编辑:我在想一个选项(虽然不是问题的答案)可能是从父级传递值,然后在子级中使用 didChangeDependencies()

【问题讨论】:

  • 如果你已经熟悉 react 的 hooks 为什么不使用riverpod hooks,它有useEffect 函数和一个值选择器方法。
  • 谢谢@MohammedAlfateh,我花了无数个小时让 Redux 工作,如果我现在改变,我会死的。这是代替 Redux 还是补充?

标签: flutter flutter-redux


【解决方案1】:

我对 react 的 useSelector 和 redux 了解不多,但 在 Flutter 中,您可以将函数作为参数传递,这有助于在不同的小部件之间更改值。

示例

  class MainClass extends StatefulWidget {
  MainClass({Key key}) : super(key: key);

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

class _MainClassState extends State<MainClass> {
  int value = 0;

  changeValue(int newValue) {
    setState(() {
      value = newValue;
    });
  }

  @override
  void initState() {
    print('value is $value');
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: <Widget>[
          InnerClass2(
            value: value,
          ),
          InnerClass(
            changeValue: changeValue,
          ),
        ],
      ),
    );
  }
}

class InnerClass extends StatefulWidget {
  Function changeValue;

  InnerClass({@required this.changeValue, Key key}) : super(key: key);

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

class _InnerClassState extends State<InnerClass> {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: RaisedButton(
        onPressed: () {
          widget.changeValue(2);
        },
      ),
    );
  }
}

class InnerClass2 extends StatelessWidget {
  final int value;
  const InnerClass2({@required this.value, Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Text(value.toString()),
    );
  }
}

【讨论】:

  • 是的@MohammadRaza,但情况不同。当 redux 存储发生变化时,我需要做一些事情。
猜你喜欢
  • 2010-12-25
  • 1970-01-01
  • 1970-01-01
  • 2019-10-27
  • 1970-01-01
  • 1970-01-01
  • 2020-11-07
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多