title: Vue template syntax increment in mustache
body: <p>Just started learn Vue.js and I am very curious what happened in my simple code, I cannot find explenation. 
  I am trying to increment counter inside mustache, but there is something weird happening with this variable</p>
  
  <p>my code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>new Vue({
    el: '#app',
    data: {
      counter: 5,
      state: false
    },
    methods: {
      fun: function() {
        this.state = !this.state
      }
    }
  })</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://unpkg.com/vue"&gt;&lt;/script&gt;
  
  &lt;div id="app"&gt;
    &lt;p&gt;{{ counter }}&lt;/p&gt;
   &lt;button v-on:click="fun"&gt;Button&lt;/button&gt;
   &lt;p v-if="state"&gt;
      Miss me? {{ counter++ }}
   &lt;/p&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I am receiving in console <code>[Vue warn]: You may have an infinite update loop in a component render function.</code> when <code>counter++</code> is calling.
  I think that I can run expression inside mustache sytaxt but in that case it does not work for me. </p>
  
  <p>Could someone explain what is happening under the hood?</p>