使用设置状态功能更新小部件

Question

我需要对setState() 函数进行一些说明。 我将问题分为 3 个，但都是关于 setState()。

1. 当调用setState 时，应用程序或 上下文（？）被重新渲染/更新？
2. setState(() {/* MY CODE */}); 中的代码对/* myCode;*/ setState(() {}); 的重要性是什么？
3. 如果我要更新 setState 函数中的一些变量 喜欢：setState(() { myText='dfg';}) 和这个变量 更新一个小部件，Text(myText)，setState 怎么会知道更新 文本小部件？

例如下面的经典代码：

    return Scaffold(
      appBar: AppBar(
        title: Text('Sample Code'),
      ),
      body: Center(
        child: Text('You have pressed the button $_count times.'),
      ),
      bottomNavigationBar: BottomAppBar(
        shape: const CircularNotchedRectangle(),
        child: Container(
          height: 50.0,
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () => setState(() {
          _count++;
        }),
        tooltip: 'Increment Counter',
        child: Icon(Icons.add),
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
    );
  }
}

在bottomNavigationBar小部件中调用了setState()（所以这个小部件被标记为脏），那么为什么我们可以在与child...body相关的Text小部件中看到更新

Answer 1

1- 当您调用 setState() 方法时，只有该小部件会重新构建。

• 我不想让事情变得复杂，但这个规则有一个例外，当使用 Lifiting state up 技术时，这将导致每次重新绘制多个小部件消费者小部件对祖先进行回调以重建状态。我将在下面显示一个图表，我希望它更清楚，但如果它看起来很复杂，你不必担心它，因为无论如何你都不会使用该技术，因为还有其他更简单和更容易的方法。

2- 没有区别，将更改的代码放入 setState() 方法中更有意义，表明这些是更改的变量。

3- 当您像这样在示例中调用setState() 时 setState(() => _count++); 不是调用setState 方法的小部件将被标记为脏，而不是依赖于该状态的小部件（这里的状态是_count 变量），所以在下一次调用build方法框架看到使用_counter变量的Text小部件是脏的，因此重新绘制它，下图显示了你的小部件树并解释了它是如何完成的