将数据数组设置为mobx数组显示代理对象

Question

我在mobx中使用react js，并且从api获取数据。 我得到的数据是对象数组。 当我将数据设置为mobx变量时，我会看到代理对象数组（不确定代理所说的内容）。我正试图将从api获取的对象数组设置为mobx变量。

我的商店

class UserStore {
@persist @observable token = null
@observable tasks = []
@observable done = false

@persist @observable email = ''

constructor() {

}
@action
getTasks = async () => {
    try {
        let response = await Api.getTasks()
        console.log('getTasks',response.tasks)
        this.tasks = response.tasks
        console.log('my new tasks',this.tasks)

    } catch (e) {
        console.log(e)
    }
}

正如您在第一块（“黑色”）中看到的那样，我从api获取数据，然后将respnse.tasks设置为this.tasks。

 this.tasks = response.tasks
  console.log('my new tasks',this.tasks)

Answer 1

这取决于您要如何观察数据。

  

“我正在尝试将从api获得的对象数组设置为mobx变量”

不是您的最终目标。

如果您希望您的观察员：

• 选项a ：在数组引用更改时做出反应
  =无需关心数组中的值。
  使用@observable.ref tasks。

• 选项b ：当数组中每个值的引用更改时做出反应
  =无需关心单个对象的属性。
  使用@observable.shallow tasks。

• 选项c ：也对单个对象的属性做出反应
  =使所有内容均可观察，引用和对象属性
  像您一样使用@observable tasks。

就像评论中指出的那样，mobx5正在使用代理，并且某些行为可能与以前的版本不同。

更多信息：Mobx arrays，Mobx decorators，shallow observability

注意：如果这样做没有帮助，您需要提供更多详细信息，例如您的React组件代码。

Answer 2

• 您可以将代理转换为Js
• 从“ mobx”导入{toJS};
• 例如：toJS（response）