Mobx-реагировать не обновляет компонент при изменении значения observable.map

Вопрос: В моем магазине.. @observable dots = observable.map({ '0x001': extendObservable({ x: 2000, y: 2000 }), '0x002': extendObservable({ x: 5000, y: 5000 }), '0x003': extendObservable({ x: 10000, y: 10000 }), }); @action updateDot(id, properties) { const dot = this.dots.get(id); this.dots.set(id, extendObservable(Object.assign(dot, properties))); } Когда я обновляю значения точек. store.updateDot('0x002', { x: 200, y: 300, }); Мои

Вопрос:

В моем магазине..

@observable dots = observable.map({ ‘0x001’: extendObservable({ x: 2000, y: 2000 }), ‘0x002’: extendObservable({ x: 5000, y: 5000 }), ‘0x003’: extendObservable({ x: 10000, y: 10000 }), }); @action updateDot(id, properties) { const dot = this.dots.get(id); this.dots.set(id, extendObservable(Object.assign(dot, properties))); }

Когда я обновляю значения точек.

store.updateDot(‘0x002’, { x: 200, y: 300, });

Мои компоненты не реагируют..

@inject(‘store’) @observer export class IndexComponent extends Component { render() { const { store } = this.props; const { dots } = store; return <Map dots={dots} /> } }

И карта..

@observer class Map extends Component { render() { const { dots } = this.props; // NOT CALLED WHEN UPDATE DOTS return <Matrix dots={dots} /> } }

И Матрица…

@observer class Matrix extends Component { render() { const { dots, …rest } = this.props; // NOT CALLED WHEN UPDATE DOTS return <div …rest ></div> } } Лучший ответ:

Лучше всего настроить скрипку, так как с этим мы действительно можем проверить решение, но я думаю

@observable dots = observable.map({ ‘0x001’: { x: 2000, y: 2000 }, ‘0x002’: { x: 5000, y: 5000 }, ‘0x003’: { x: 10000, y: 10000 }, }); @action updateDot(id, properties) { const dot = this.dots.get(id); Object.assign(dot, properties) }

Этого достаточно (без тестирования, без гарантий). По наблюдениям по умолчанию их дети также наблюдаются, если они являются не сложными объектами. Обратите внимание, что object.assign в updateDot работает только для предопределенных свойств (x и y в этом случае). MobX еще не может отслеживать несуществующие свойства. Поэтому либо убедитесь, что все возможные параметры указаны заранее (с неопределенным значением, если необходимо), либо используйте структуру карты для точек.

Ответ №1

Я думаю, это зависит от вашего компонента Metrix. Как вы используете dots в нем?

MobX не будет переигрывать, если вы просто передадите наблюдаемое значение в качестве реквизита.

Вы должны действительно читать данные из него.

В этом случае ваша матрица должна быть dots.get(….) тогда ваша Metrix будет переименовывать, когда dots были изменены.

Кстати, ваш IndexComponent и Map не будут перезагружены, если они просто пропустят dots.

Оцените статью
Добавить комментарий