我不明白为什么列表没有加载

Question

我不明白为什么 TodoList 在我进入应用程序时没有立即加载。我得到的不是列表，而是 TodoEmptyState 状态，即使我已经在数据库中保存了项目，它一开始仍然是一个空列表。但在那之后，当我添加一个新元素并更新它时，它就会加载。但是我希望在不单击按钮的情况下进入应用程序时立即加载列表（如果有保存的项目）。 请告诉我怎么做？

home_screen

Widget build(BuildContext context) {
    return BlocBuilder<TodoBloc, TodoState>(builder: (context, state) {
      return Scaffold(
        appBar: AppBar(
          title: const Text('Flutter Todos'),
        ),
        body: SingleChildScrollView(
          child: Column(
            children: [
              TodoList(),
            ],
          ),
        ),

todo_list

class TodoList extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final TodoBloc todoBloc = context.read<TodoBloc>();
    return BlocBuilder<TodoBloc, TodoState>(builder: (context, state) {
      if (state is TodoEmptyState) {
        return const Center(
          child: Text(
            'No Todo',
            style: TextStyle(fontSize: 20.0),
          ),
        );
      }

      if (state is TodoLoadingState) {
        return const Center(child: CircularProgressIndicator());
      }

      if (state is TodoLoadedState) {
        return ListView.builder(
            physics: const NeverScrollableScrollPhysics(),
            shrinkWrap: true,
            itemCount: state.loadedUser.length,
            itemBuilder: (context, index) =>
                // return _buildListTile(state.loadedUser[index]);
                ListTile(
                  title: Column(children: [
                    Text('${state.loadedUser[index].description}'),
                    Text('${state.loadedUser[index].id}'),
                  ]),
                  trailing: IconButton(
                    onPressed: () {
                      todoBloc.add(DeleteTodos(id: state.loadedUser[index].id));
                      todoBloc.add(LoadTodos());
                    },
                    icon: const Icon(Icons.delete),
                  ),
                ));
      }
      return const SizedBox.shrink();
    });
  }
}

todo_bloc

class TodoBloc extends Bloc<TodoEvent, TodoState> {
  final TodoRepository todoRepository;

  TodoBloc(this.todoRepository) : super(TodoEmptyState()) {
    on<LoadTodos>((event, emit) async {
      emit(TodoLoadingState());
      try {
        final List<Todo> _loadedTodoList = await todoRepository.getAllTodos();
        emit(TodoLoadedState(loadedUser: _loadedTodoList));
      } catch (_) {
        emit(TodoErrorState());
      }
    });

这是进入应用程序时的画面，但我的数据库中已有数据，但没有立即显示。为什么？

Answer 1

现在，您将任何事件添加到您的 bloc 的唯一位置是 IconButton 的 onPressed 内，这就是为什么您的 bloc 状态保持在其初始状态 TodoEmptyState 而不是'在按下 IconButton 之前不会更改。您可以将 TodoList 转换为 StatefulWidget 并将 LoadTodos 事件添加到 initState 中的 bloc:

class TodoList extends StatefulWidget {
  @override
  State<TodoList> createState() => _TodoListState();
}

class _TodoListState extends State<TodoList> {
  @override
  void initState() {
    super.initState();
    todoBloc.add(LoadTodos());
  }

  @override
  void dispose() {
    todoBloc.close();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    final TodoBloc todoBloc = context.read<TodoBloc>();
    return BlocBuilder<TodoBloc, TodoState>(builder: (context, state) {
      if (state is TodoEmptyState) {
        return const Center(
          child: Text(
            'No Todo',
            style: TextStyle(fontSize: 20.0),
          ),
        );
      }

      if (state is TodoLoadingState) {
        return const Center(child: CircularProgressIndicator());
      }

      if (state is TodoLoadedState) {
        return ListView.builder(
            physics: const NeverScrollableScrollPhysics(),
            shrinkWrap: true,
            itemCount: state.loadedUser.length,
            itemBuilder: (context, index) =>
            // return _buildListTile(state.loadedUser[index]);
            ListTile(
              title: Column(children: [
                Text('${state.loadedUser[index].description}'),
                Text('${state.loadedUser[index].id}'),
              ]),
              trailing: IconButton(
                onPressed: () {
                  todoBloc.add(DeleteTodos(id: state.loadedUser[index].id));
                  todoBloc.add(LoadTodos());
                },
                icon: const Icon(Icons.delete),
              ),
            ));
      }
      return const SizedBox.shrink();
    });
  }
}

我不明白为什么列表没有加载

I can't figure out why the list isn't loading

dart

flutter

flutter-layout