如何侦听作为 vuejs 中对象的道具的更改答案

【问题标题】：How to listen for changes to props that are objects in vuejs如何侦听作为 vuejs 中对象的道具的更改
【发布时间】：2020-02-01 06:27:55
【问题描述】：

为什么我的观看对象道具的代码在 vuejs 中不起作用？

我浏览了有关此问题的其他 Q/A 帖子，但没有找到适合我的解决方案。

在我的子组件中，我正在观看这样的过滤器道具...

export default {
  name: "ChildComponent",
  props: ["list", "searchTerms", "filters"]

  watch: {
    filters: {
      deep: true,
      handler: () => {
        console.log("filter updated");
        if (this.voterLayerActive) {
          this.fetchBoundaryBox();
          this.createMapWithLeafletAndMapTiler();
        }
      }
    }

在我的父组件中，我像这样传递过滤器道具...

       <template> ...<ContactsMap :filters="f"></ContactsMap> ...</template>

<script>
...
export default {
  name: "ParentComponent",

  data() {
    return {
      f: {},
      ...
....
</script>

【问题讨论】：

标签： vue.js watch prop

【解决方案1】：

尝试将您的手表处理程序箭头函数替换为：

  watch: {
    filters: {
      deep: true,
      handler(){
        console.log("filter updated");
        if (this.voterLayerActive) {
          this.fetchBoundaryBox();
          this.createMapWithLeafletAndMapTiler();
        }
      }
    }

【讨论】：