Как прослушать изменения в реквизитах, которые являются объектами в vuejs

Question

Почему мой код для наблюдения за объектом не работает в 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>

Answer 1

Попробуйте заменить функцию стрелки вашего обработчика часов:

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