title: v-if not triggered on computed property
body: <p>I have a vuex store. on change of state preference in the vuex store. i want to rerender the DOM. i want the checkValue method to be called everytime the state preference in the vuex store changes.</p>
  
  <p>index.html</p>
  
  <pre><code>&lt;div id="app"&gt;
      &lt;my-component&gt;&lt;/my-component&gt;
      &lt;my-other-component&gt;&lt;/my-other-component&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>vue is initialised, and also store is imported here</p>
  
  <p>my_component.js</p>
  
  <pre><code>Vue.component('my-component',require('./MyComponent.vue'));
  import store from "./store.js"
  Vue.component('my-other-component',require('./MyOtherComponent.vue'));
  import store from "./store.js"
  
  new Vue({
      el : "#app",
      data : {},
      store,
      method : {},
  })
  </code></pre>
  
  <p>component where DOM needs to be change on change of the state preference in store</p>
  
  <p>MyComponent.vue</p>
  
  <pre><code>&lt;template&gt;
      &lt;div v-for="object in objects" v-if="checkValue(object)"&gt;
          &lt;p&gt;hello&lt;/p&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  
  
  &lt;script&gt;
      methods : {
          checkValue : function(object) {
              if(this.preference) {
                  // perform some logic on preference
                  // logic results true or false
                  // return the result
              }
          }
      },
  
      computed : {
          preference : function() {
              return this.$store.getters.getPreference;
          }
      }
  
  
  &lt;/script&gt;
  </code></pre>
  
  <p>Vuex store file</p>
  
  <p>store.js</p>
  
  <pre><code>const store = new Vuex.Store({
  state : {
      preferenceList : {components : {}},
  },
  getters : {
      getPreference : state =&gt; {
          return state.preferenceList;
      }
  },
  mutations : {
      setPreference : (state, payload) {
          state.preference['component'] = {object_id : payload.object_id}
      }
  }
  </code></pre>
  
  <p>component from where the vuex store is updated on clicking in the li element.</p>
  
  <p>MyOtherComponent.vue</p>
  
  <pre><code>&lt;div&gt;
      &lt;li v-for="component in components" @click="componentClicked(object)"&gt;
      &lt;/li&gt;
  &lt;/div&gt;
  
  
  &lt;script type="text/javascript"&gt;
      methods : {
          componentClicked : function(object) {
              let payload = {};
              payload.object_id = object.id;
              this.$store.commit('setPreference', payload);
          }
      }
  &lt;/script&gt;
  </code></pre>