Как я могу клонировать объект с наблюдаемым свойством и автоматически запустить метод нового объекта?

Есть объект, обладающий наблюдаемым свойством. Автозапуск работает хорошо.

Я хочу клонировать новый объект, но автозапуск не работает.

Вот мой код :

Шаг 1:

vim roadStore.mjs

import mobx from 'mobx'
const { observable, autorun } = mobx
import ramda from 'ramda'
const { clone } = ramda
const roadStore = {
  data: observable([
    {
      name: "something",
    }
  ]),

  getData: function () {
    console.log(this.data[0].name);
  }
}

var target = (roadStore)
// var target = clone(roadStore) // line18.

autorun(() => {
  console.log('----autorun');
  target.getData()
})


// clone

setTimeout(() => {
  target.data[0].name = 'timeout1'
}, 1000)
setTimeout(() => {
  target.data[0].name = 'timeout2'
}, 2000)


export default roadStore

Шаг 2:

узел --experimental-modules roadStore.mjs

можно увидеть автозапуск 3 раза (1 инициализация + 2 модифицированных)

➜  ✗ node --experimental-modules src/store/roadStore.mjs
(node:43793) ExperimentalWarning: The ESM module loader is experimental.
----autorun
something
[MobX] Since strict-mode is enabled, changing (observed) observable values without using an action is not allowed. Tried to modify: ObservableArray@1[..].name
----autorun
timeout1
[MobX] Since strict-mode is enabled, changing (observed) observable values without using an action is not allowed. Tried to modify: ObservableArray@1[..].name
----autorun
timeout2

Шаг 3:

комментарий lin17

uncommnet lin18

import mobx from 'mobx'
const { observable, autorun } = mobx
import ramda from 'ramda'
const { clone } = ramda
const roadStore = {
  data: observable([
    {
      name: "something",
    }
  ]),

  getData: function () {
    console.log(this.data[0].name);
  }
}

// var target = (roadStore)
var target = clone(roadStore)

autorun(() => {
  console.log('----autorun');
  target.getData()
})


// clone

setTimeout(() => {
  target.data[0].name = 'timeout1'
}, 1000)
setTimeout(() => {
  target.data[0].name = 'timeout2'
}, 2000)


export default roadStore

автоматический запуск только запускать время, почему?

➜  cp-side-panel git:(feat-cp-side-panel) ✗ node --experimental-modules src/store/roadStore.mjs
(node:44101) ExperimentalWarning: The ESM module loader is experimental.
----autorun
something

person bob alan green    schedule 06.01.2021    source источник


Ответы (1)


исправлено с помощью makeObservable

const {makeObservable, observable, autorun} = require('mobx')
const {clone} = require('ramda')
var obj = {
  data: [
    {
      name: "something",
    }
  ],

  getData: function () {
    console.log(this.data[0].name);
  }
}


const target = clone(obj)

makeObservable(target, {
  data: observable,
})



autorun(() => {
  target.getData()
})

setTimeout(() => {
  target.data[0].name = "new string"
}, 2000)

person bob alan green    schedule 06.01.2021