title: Vue.js concatenate string in v-text
body: <p>I am trying to concatenate string inside v-text directive. Simple example:</p>
  
  <pre><code>&lt;ul&gt;
    &lt;li v-for="obj in frameworks"&gt; {{ obj.name }} has {{ obj.vite }} users
      &lt;button v-on:click="removeFw(obj)" v-show="mode == 'edit'"&gt;Delete&lt;/button&gt;
    &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>This works fine. Now, instead of using the text interpolation if i use v-text like below, i still get the text showing up, but the <code>Delete</code> buttons disappear, regardless of the value of the <code>mode</code> property. These buttons should be visible if user clicks the <code>edit</code> button.</p>
  
  <pre><code> &lt;ul&gt;
      &lt;li v-for="obj in frameworks" v-text="`${obj.name} has ${obj.votes} users`"&gt;
       &lt;button v-on:click="removeFw(obj)" v-show="mode == 'edit'"&gt;Delete&lt;/button&gt;
      &lt;/li&gt;
   &lt;/ul&gt;
  </code></pre>
  
  <p>Here is the fiddle: 
  <a href="https://jsfiddle.net/30a6edvs/" rel="nofollow noreferrer">https://jsfiddle.net/30a6edvs/</a></p>
  
  <p>Can anyone please explain why.</p>