Vuex store 中一个 Map 表示的状态，如何通知是否添加了任何项目以及添加了什么特定项目？

Question

我在 Vuex 中有一个名为“activeCharts”的地图作为状态。键是图表的 ID，值是关于该图表的一些东西。在我的应用程序中添加、删除图表或正在修改它们的值。有什么办法，如何在 Vuex 中的地图“activeCharts”每次更改后通过单击任何图表进行更改？我需要提取隐藏在地图值中的值。

这是我在 Vuex 中的状态 -> Computed 和 Watch 在一个组件中。

activeCharts: new Map()

computed: {
    activeCharts: {
      get() {
        return this.$store.state.chart.activeCharts;
      }
    },
    activeChartsSize: {
      get() {
        return this.$store.state.chart.activeCharts.size;
      }
    },
 }

watch: {
    activeCharts: {
      deep: true,
      handler : function (newValue, oldValue) {
        if (newValue !== oldValue) {
          console.log("Maps are different")
          console.log(oldValue)
          console.log(newValue)
        }
      }
    },
   activeChartsSize: {
      handler: function (newSize, oldSize) {
      console.log("Old size : ",oldSize)
      console.log("New size: ",newSize)
  }
}
 }

我正在尝试在“activeCharts”上使用 watch newValue 和 oldValue，但在与图表进行任何交互后似乎都一样，没有任何变化。

如果我观察 activeChart.size，变化会很明显。每次我将图表添加到地图中时，控制台都会记录当前活动图表的数量。

添加或修改任何图表后如何提取更改？