установить массив данных в массив mobx показать прокси-объекты

Я использую react js с mobx и получаю данные от 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)

person Manspof    schedule 30.07.2018    source источник
comment
Этот код у вас не работает? MobX 5 использует Proxy под капотом, так что в этом нет ничего странного.   -  person Tholle    schedule 31.07.2018
comment
код работает, но я не могу использовать this.tasks и отображать задачи.   -  person Manspof    schedule 31.07.2018


Ответы (2)


Это зависит от того, как вы хотите наблюдать за данными.

«Я пытаюсь просто установить массив объектов, которые я получаю от API, в переменную mobx»

на самом деле не является вашей конечной целью.

Если вы хотите, чтобы ваши наблюдатели:

  • вариант а: реагировать на изменение ссылки на массив
    = не обращать внимания на значения в массиве.
    Используйте @observable.ref tasks.

  • вариант б: реагировать, когда ссылки на каждое значение в массиве изменяются
    = не заботиться о свойствах отдельных объектов.
    Используйте @observable.shallow tasks.

  • вариант c: реагировать и на свойства отдельных объектов
    = сделать все наблюдаемым, ссылки и свойства объектов
    Используйте @observable tasks так же, как и вы.

Как указано в комментариях, mobx5 использует прокси, и некоторое поведение может отличаться от предыдущей версии.

Дополнительная информация: массивы Mobx, декораторы Mobx, поверхностная наблюдаемость

Примечание: вам нужно будет предоставить более подробную информацию, если это вам не поможет, например, ваш код компонента реакции.

person Kev    schedule 31.07.2018

Вы можете конвертировать прокси в JS:

import { toJS } from 'mobx'

// example
toJS(response)
person Tarun konda    schedule 26.04.2019
comment
Это был бы принятый ответ. - person Mark Andog; 28.02.2021