时间戳

首页 > 解决方案 > 将数组与可观察的 MobX 可观察数组进行比较

javascript - 将数组与可观察的 MobX 可观察数组进行比较

问题描述

我的 stores/index.js 中有一个可观察的数组，如下所示：

class Store {

    @observable order = [];

    fetchData = flow(function*() {
       try {
          const myData = yield backendService.retrieveData();

          if (myData.length > 0) {
             this.order = myData.map(element => {
                return element.id;
             });
          }
       } catch (error) { // error handling }
    });

    ...

}

我在一个组件中使用这个可观察数组来与另一个数组进行比较，如果它们不一样，我将通过一个动作更新可观察数组。

export default
@inject('store')
@observer
class myComponent extends React.Component {

     ...

     _closeModal() {
        const newOrder = this.state.data.map(element => {
           return element.id;
        });

        if (toJS(store.order) !== newOrder) {
           store.updateOrder(newOrder);
        }
     }
}

但是两个数组的比较结果是错误的，即使我不做任何更改，toJS(store.order) !== newOrder仍然返回true。我不知道我做错了什么，但是当我控制台记录这两个数组时，它们返回完全相同的内容。

标签： javascriptarraysreact-nativeobservablemobx

解决方案

在 Javascript 中，当两个数组都引用同一个数组时，两个数组是严格相等的。所以[] === []返回假！因为它们是不同的数组。

您可以通过以下方式更改代码：

if (JSON.stringify(toJS(store.order)) !== JSON.stringify(newOrder))

推荐阅读