Question

“ mobx反应”：“ ^ 5.3.6”， “ react”：“ ^ 16.6.3”， “ antd”：“ ^ 3.10.3”，

我正在使用mobx-react，观察一个对象列表。列表中的val已更改，但页面未重新呈现

数据结构

list = [{ 编号：1 状态：1， ... }]

工作

this.items.replace(this.items);

不起作用

 @observable.deep items = [];


@observer
class TableList extends Component {
  @observable items = [];//my list
...

  toggleOnline(data) {
    const { id, status } = data;
    const temp_status = status == 2 ? 1 : 2;
    ajax.post('page/switch', {
      id, status: temp_status
    }).then(action(() => {

      data.status = temp_status;
      message.success('操作成功');
    })).catch(err => {
      message.error(err);
    });
  }


render(){


 return

...
 <aonClick={this.toggleOnline.bind(this, record)}>{record.status == 2 || record.status == -1 ? '启用' : '停用'}</a>

...

 <Table
              rowKey="id"
              loading={loading}
              dataSource={this.items.toJS()}
              columns={this.columns}
              onChange={this.handleStandardTableChange}
            />

}

}

Answer 1

阅读： What does MobX react to?

部分：Incorrect: store a local reference to an observable object without tracking

const author = message.author;
autorun(() => {
    console.log(author.name)
})
message.author.name = "Sara";
message.author = { name: "John" };

将提取第一个更改，message.author和author是相同的对象，并且.name属性在自动运行中被取消引用。但是第二个更改将不会被提取，即message.author 自动运行不跟踪该关系。自动运行仍在使用 “老”作家。

您不应重新分配可观察变量。

mobx列表已更新，但是重新渲染没有用

1 个答案: