Question

I completed the Flutter NameGenerator code lab and wanted to extend it to remove items directly from the "Saved suggestions list". To do so, I've added the onTap handler below which removes the pair from the list. However, the list doesn't update until I navigate back and reopen the screen again. How do I immediately update the list on the second screen?

void _pushSaved() {
  Navigator.of(context).push(MaterialPageRoute<void>(
    builder: (BuildContext context) {
      final Iterable<ListTile> tiles = _saved.map((WordPair pair) {
        return ListTile(
          title: Text(
            pair.asPascalCase,
            style: _biggerFont,
          ),
          onTap: () => setState(() {
            _saved.remove(pair);
          }),
        );
      });

      final List<Widget> divided = ListTile.divideTiles(
        context: context,
        tiles: tiles,
      ).toList();

      return Scaffold(
        appBar: AppBar(
          title: const Text('Saved Suggestions'),
        ),
        body: new ListView(children: divided),
      );
    }),
  );
}

Answer 1

为什么您的代码不起作用

您的列表未更新的原因是，它是在导航器上推送的另一个屏幕。

由于您的_pushSaved方法位于原始屏幕内，因此您在该屏幕上调用setState并重建原始屏幕的所有小部件。推送的屏幕不受影响，因为它不是原始屏幕的子级。相反，原始屏幕告诉导航器创建一个新屏幕，因此它是Navigator中MaterialApp的某个子树，您无法访问。

解决方案

仅使用StatefulWidget来访问不同屏幕上的相同实时数据并不容易。基本上，您的项目已经变得足够复杂，因此是时候考虑一种更复杂的状态管理解决方案了。这是关于状态管理的video from Google I/O，您可以查看一下一些启发。

Flutter Codelab: Update ListView on different screen

1 个答案: