是否可以观察特定地图条目的 mobx-state-tree 事件答案

【问题标题】：Is it possible to observe mobx-state-tree events for a specific map entry是否可以观察特定地图条目的 mobx-state-tree 事件
【发布时间】：2021-05-17 10:31:29
【问题描述】：

是否可以这样做：

observe(props.store.zone.players[props.socket_id], (change) => {

  ...

})

我想在组件的每个特定实例上监听事件。

这里是区域商店：

const ZoneState = types
  .model({
    name: types.optional(types.string, ""),
    players: types.map(PlayerState),
  })
  .actions((self) => ({
    syncPlayer(params) {
      const player = self.players.get(params.id);
      const oldPlayerData = toJS(player);
      self.players.put(params);
    },

  }));

还有播放器商店

import { types } from "mobx-state-tree";

const PlayerState = types
  .model({
    id: types.identifier,
    socket_id: types.optional(types.string, ""),
    x: types.integer,
    z: types.integer,
    name: types.optional(types.string, "Unknown One"),
  })
  .actions((self) => ({
    sync(params) {
      self.x = params.x;
      self.z = params.z;
    },
  }));

export default PlayerState;

【问题讨论】：

是的，你可以例如使用observe or autorun to run some code when a specific map entry changes。

标签： mobx mobx-state-tree

【解决方案1】：

你可以例如当特定映射条目发生变化时，使用observe 或autorun 运行一些代码。

示例

// ...

const zoneState = ZoneState.create();

zoneState.syncPlayer({ id: "1", socket_id: "1", x: 1, z: 2, name: "test" });

observe(zoneState.players.get("1"), (change) => {
  console.log("observe", change);
});

autorun(() => {
  console.log("autorun", zoneState.players.get("1"));
});

zoneState.syncPlayer({ id: "1", socket_id: "1", x: 1, z: 2, name: "test 2" });

【讨论】：