无法使用Mobx更改GridView Flutter中复选框的状态

Question

我想在Flutter中为GirdView添加一个复选框。数据是从API请求包含属性selected获取的，默认为false。当我单击每个项目的复选框时，它将更改值为True并在UI上更新，我使用Mobx观察这些更改操作。当我调试值时，值已更改但UI未更新，我真的不知道原因。我在下面为UI和Mobx模型添加了2张图片。

API：

{
    "name": "HuynhDuy Phuc",
    "birthday": "None",
    "phone": "N/A",
    "isSelected": false
},
{
    "name": "Doan Phuc",
    "birthday": "None",
    "phone": "N/A",
    "isSelected": false
},
{
    "name": "Phuc Vu",
    "birthday": "None",
    "phone": "N/A",
    "isSelected": false
},

    final _userApiPresenter = Provider.of<UserApiPresenter>(context);
    _userApiPresenter.fetchUsersList();

Observer(
                  name: 'ListHomePage',
                  builder: (BuildContext context) {
                    return (_userApiPresenter.userAPI != null)
                        ? AnimationLimiter(
                            child: GridView.builder(
                              physics: BouncingScrollPhysics(),
                              padding: EdgeInsets.all(12),
                              addAutomaticKeepAlives: true,
                              //Determine the number of cells per row
                              gridDelegate:
                                  new SliverGridDelegateWithFixedCrossAxisCount(
                                      crossAxisCount: 3),
                              itemCount:
                                  _userApiPresenter.userAPI.users.length,
                              itemBuilder: (context, index) {
                                User user =
                                    _userApiPresenter.getUser(index: index);
                                return AnimationConfiguration.staggeredGrid(
                                  position: index,
                                  duration:
                                      const Duration(milliseconds: 375),
                                  columnCount: 2,
                                  child: Container(
                                    child: ScaleAnimation(
                                      child: GestureDetector(
                                        child: Stack(
                                          children: <Widget>[
                                            UserItem(
                                              name: user.name,
                                              type: user.name,
                                              phone: user.phone,
                                              birthday: user.birthday,
                                              isSelected: user.selected,
                                            ),
                                            Align(
                                              alignment: Alignment.topRight,
                                              child: Checkbox(
                                                value: user.selected,
                                                onChanged: (_) {
                                                    if(user.selected){
                                                      _userApiPresenter.changeStatusCheckBox(index: index);
                                                    } else{
                                                      _userApiPresenter.changeStatusCheckBox(index: index);
                                                    }
                                                },
                                              ),
                                            ),
                                          ],
                                        ),
                                        onTap: () {
                                          Navigator.push(
                                            context,
                                            MaterialPageRoute(
                                              builder:
                                                  (BuildContext context) =>
                                                      UserDetailPage(
                                                index: index,
                                                name: user.name,
                                              ),
                                            ),
                                          );
                                        },
                                      ),
                                    ),
                                  ),
                                );
                              },
                            ),
                          )
                        : Center(
                            child: CircularProgressIndicator(),
                          );
                  },
                )

UI

Mobx model

Answer 1

缺少有关用户数组和用户模型本身的可观察信息，但是您需要做的（如果尚未做的是：]]

• 也使用户阵列可观察-这样，任何添加，删除等操作都将导致UI中用户框数量的更新
• 也可以观察selected的属性User-这样，当某些用户处于“选定”状态时，UI会呈现更改

还有一些话题：

• 您不需要@action方法的getUser属性，因为该方法不会更新任何可观察的数据

如果此答案不能解决您的问题，请提供userApi和User的实现：）