title: How to get Data correctly in Vue.js
body: <p>Here is my code and I want to get <code>list</code> array and show them in <code>html</code></p>
  
  <pre><code>&lt;!DOCTYPE HTML&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;script src="https://unpkg.com/vue"&gt;&lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
  
          &lt;div id="app"&gt;
              &lt;h2&gt;{{number}}&lt;/h2&gt;
              &lt;h2&gt;Here it is!&lt;/h2&gt;
              &lt;div v-for="item in list"&gt;{{ item.question_text }}&lt;/div&gt;
          &lt;/div&gt;
  
      &lt;/body&gt;
  
  &lt;script type="text/javascript"&gt;
  
  var app = new Vue({
          el: '#app',
          data: {
              number:0,
              list : [{question_text: "apple", question_owner: "HJ", answer_owner: "1Sun"}, 
              {question_text: "banana", question_owner: "HJ", answer_owner: "1Sun"},
              {question_text: "caramel", question_owner: "HJ", answer_owner: "1Sun"},
              {question_text: "demon", question_owner: "HJ", answer_owner: "1Sun"}]
  
          }
      })
  
  &lt;/script&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/zx3Ed.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/zx3Ed.png" alt="enter image description here"></a></p>
  
  <p>I think <code>Vue</code> was recognized rightly but some error happened while getting data, because four <code>div</code> DOM element was made well. Then, Why couldn't I get data properly??</p>