web-dev-qa-db-ja.com

データの配列をmobx配列に設定するshowproxyobjects

私はmobxでreactjsを使用しており、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)
    }
}

enter image description here

ここで最初のブロック（「黒」）にあるように、APIから取得したデータを、respnse.tasksをthis.tasksに設定します。

 this.tasks = response.tasks
  console.log('my new tasks',this.tasks)
mobxmobx-react
5
Manspof

データをどのように観察するかによって異なります。

「APIから取得したオブジェクトの配列をmobx変数に設定しようとしています」

本当にあなたの最終目標ではありません。

オブザーバーに次のことをさせたい場合：

  • オプションa：配列参照が変更されたときに反応する
    =配列内の値は関係ありません。
    使用する @observable.ref tasks。

  • オプションb：配列内の各値の参照が変更されたときに反応します
    =個々のオブジェクトのプロパティは気にしません。
    使用する @observable.shallow tasks。

  • オプションc：個々のオブジェクトのプロパティにも反応します
    =すべてを観察可能にし、参照とオブジェクトのプロパティ
    使用する @observable tasksあなたのように。

コメントに示されているように、mobx5はプロキシを使用しており、一部の動作は以前のバージョンとは異なる場合があります。

詳細： Mobx配列 、 Mobxデコレータ 、 浅い可観測性

注：reactコンポーネントのコードなど、これで問題が解決しない場合は、詳細を入力する必要があります。

4
Kev
  • プロキシをJsに変換できます
  • 'mobx'から{toJS}をインポートします。
  • 例：toJS（応答）
5
Tarun konda