Flutter 列表视图渲染问题答案

【问题标题】：Flutter list view rendering issueFlutter 列表视图渲染问题
【发布时间】：2019-01-11 11:47:40
【问题描述】：

我目前正在学习 Flutter。我开始尝试构建基本列表应用程序。我的当前流程是我的 Stateful TasksManager 小部件将用户输入保存到状态，然后将其推送到 _taskList 列表，我已将其发送到无状态 TaskList 小部件，该小部件正在呈现列表。

我希望在单击“保存”按钮后使用新任务更新列表视图，但我得到的是在“保存”之后，列表视图仅在随后的状态更改期间更新。例如，如果我要“保存”字符串“Foo”以添加到列表中，那么在我输入另一个项目（例如“Bar”）后，我只会在视图中看到该更新。

任务管理器

class TasksManager extends StatefulWidget{
@override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return TasksManagerState();
  }

}

class TasksManagerState extends State<TasksManager>{

  final List _taskList = [];
  String _newTask = '';


  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Column(
      children: <Widget>[
        TextField(
          onChanged: (value){
            setState(() {
              _newTask = value;
            });
            print(_taskList);
          },
        ),
        RaisedButton(
          child: Text('Save'),
          onPressed: () => _taskList.add(_newTask),
        ),
        Expanded(child: TaskList(_taskList))
      ],
    );
  }

}

任务列表

class TaskList extends StatelessWidget {
  final List taskList;

  TaskList(this.taskList);

  Widget _buildListItem(BuildContext context, int index) {
    return ListTile(
      title: Text(taskList[index]),
    );
  }


  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return ListView.builder(
      itemBuilder: _buildListItem,
      itemCount: taskList.length,
    );
  }
}

【问题讨论】：

标签： dart flutter

【解决方案1】：

是的，Flutter 仅在收到指示时更新。 setState() 将小部件标记为脏并导致 Flutter 重建：

onPressed: () => setState(() => _taskList.add(_newTask)),

【讨论】：