title: How to access the elements of [__ob__: Observer] in VueJS?
body: <p>I am fairly new to VueJS. There is a parent component, from which, data is passed to child and grandchild.</p>
  
  <p>My Child component looks like this,</p>
  
  <p><strong>B.vue</strong></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>import C from './c.vue'
  
  export default{
  
      props:['info'],
  
      components:{
          'c': C
      },
      
      created: function(){
        this.getInfo();
      },
  
      methods: {
          getInfo: function(){
              console.log("Printing inside get method", this.info);
          }
      }
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;template&gt;
    &lt;div&gt;
      &lt;c :info="info"&gt;&lt;/c&gt;
    &lt;/div&gt;
  &lt;/template&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>When I see the console, I see an array printed like this,</p>
  
  <p><a href="https://i.stack.imgur.com/LIkQX.png" rel="noreferrer"><img src="https://i.stack.imgur.com/LIkQX.png" alt="[__ob__: Observer] array"></a> </p>
  
  <p>When i try to access the elements of the array like this, info[0], the console shows undefined. I am unable to access the elements of the array. Can someone please help me out here? Thanks!</p>