title: Vue, why curly braces message data doesn't show up?
body: <p>below is my html, please help me have a look.
  the first section is using curly brace, I want show the data, but it fails
  the second section is using v-text or v-html, it works fine, why? 
  and how can I show the first one also. thanks.</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en" dir="ltr"&gt;
  &lt;head&gt;
  &lt;meta charset="utf-8"&gt;
  &lt;script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id="app-1"&gt;
  &lt;p&gt;{{message}}&lt;/p&gt;
  &lt;/div&gt;
  &lt;div id="app-2"&gt;
  &lt;p v-text='message'&gt;&lt;/p&gt;
  &lt;/div&gt;
  &lt;script type="text/javascript"&gt;
  const app1 = new Vue({
   el:'#app-1',
   data: {
   message: 'Hello app-1!'
   }
  })
  const app2 = new Vue({
   el: '#app-2',
   data: {
   message: 'Hello app-2!'
  }
  })
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>