Mobx4 - observable.map .keys() .values() return 函数而不是数组

Question

我正在尝试使用装饰语法声明一个 observable.map。

class UiStore {
   loaders = observable.map({})
}

export default decorate(UiStore, {
   loaders: observable
})

但是当我尝试使用 loaders.keys() 它只是输出函数定义，而不是返回值：

{next: ƒ, Symbol(Symbol.iterator): ƒ}

Answer 1

您正在从一个可观察对象创建一个可观察对象。

class UiStore {
   loaders = observable.map({}) // Creates an observable map
}

export default decorate(UiStore, {
   loaders: observable // creates an observable from the observable map
})

做一次就够了（不是这里的问题）。您的主要问题是，您期望的是错误的事情。大多数 map 方法 return 是迭代器而不是您期望的数组。所以你的问题与 mobx 无关，但与你对 javascript 的 Map 方法如何工作的理解有关。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/keys

如何迭代一个交互器

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of

const { decorate, observable, autorun } = mobx;

class UiStore {
   loaders = new Map()
}

const decoratedUiStore = decorate(UiStore, {
   loaders: observable
});

const uiStore = new decoratedUiStore();

autorun(() => {
  for (const key of uiStore.loaders.keys()) {
    console.log(key);
  }
});


uiStore.loaders.set('name', 'jeff');

<script src="https://cdnjs.cloudflare.com/ajax/libs/mobx/4.1.1/mobx.umd.min.js"></script>

Mobx4 - observable.map .keys() .values() return 函数而不是数组

Mobx4 - observable.map .keys() .values() return function instead of array

javascript

mobx