A
A
Alexander Fadeev2017-10-03 13:48:03
Vue.js
Alexander Fadeev, 2017-10-03 13:48:03

How to monitor the state of a set on a page?

Good day, I'm making a product filter block on the site, which represents a set of fields with different names and values. on average, there will be 3-5 filters per page. ran into the problem of tracking the state of all these elements as a whole. I tried to specify v-model="filter['name']" and hang the watcher on the filter, but this watcher only works when changing the keys of the array, but not the values. It does not react to changing values.
How is it easier to monitor the status of a set of filter fields for the subsequent updating of the product page?

Answer the question

In order to leave comments, you need to log in

1 answer(s)
0
0xD34F, 2017-10-03
@An_Tux

I tried to specify v-model="filter['name']" and hang the watcher on the filter, but this watcher only works when changing the keys of the array, but not the values. It does not react to changing values.

Yes, changes to object properties are not tracked by default.
To do this, you need to specify deep: truein the watcher's settings:
watch: {
  filters: {
    deep: true,
    handler() {
      console.log(JSON.stringify(this.filters, null, 2));
    }
  }
}

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question