title: Cannot read property of 'Undefined' in vue.js
body: <p>This is my vue instance:</p>
  
  <pre><code>var vue = new Vue({
    el: '#vue-wrapper',
    data: {
      items: [],
  }})
  </code></pre>
  
  <p>This is a v-for loop in my index.html.eex</p>
  
  <pre><code>&lt;div v-for="item in items[0].subItems"&gt;{{item.name}}&lt;/div&gt;
  </code></pre>
  
  <p>This is the script where I populate items, on document ready, with data passed during rendering from my Phoenix server.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
        jQuery(document).ready(function() {
        //Assign server-side parameters
        vue.items = &lt;%= raw(@items) %&gt;;
        console.log(vue.items);
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>The log function shows the proper list of items that i want.
  Problem is that I can't access them in the v-for loop, I'm getting:</p>
  
  <pre><code>vue.min.js:6 TypeError: Cannot read property 'subItems' of undefined
  </code></pre>
  
  <p>I can't access the first element, like items are still not populated.
  How can I achieve this? I'm forced to initialize it in the index.html.eex file because I need the eex syntax to retrieve data passed from the server.</p>