title: Vue component access data object
body: <p>How can i check if an object have a children element inside computed properties
  EX. <a href="https://jsfiddle.net/zvku6voo/" rel="nofollow">https://jsfiddle.net/zvku6voo/</a></p>
  
  <p>I need to check submenu function on click, on load page and pass default open submenu, How can i access the current object on submenu function?</p>
  
  <p>HTML and template:
       
          
      </p>
  
  <pre><code>&lt;template id="ids-sidebar-menu-template"&gt;
      &lt;li v-for="li in list" &gt;
          &lt;a href="@{{ li.url }}" @click="toggle" &gt;
              @{{li.title}}
              &lt;span v-if="submenu" class="right"&gt; + &lt;/span&gt;
          &lt;/a&gt;
          &lt;ul v-show="open" v-if="submenu"&gt;
              &lt;ids-sidebar-menu :list="li.children"&gt;&lt;/ids-sidebar-menu&gt;
          &lt;/ul&gt;
      &lt;/li&gt;
  &lt;/template&gt;   
  </code></pre>
  
  <p>Vue Component:</p>
  
  <pre><code>Vue.component('ids-sidebar-menu', {
      template : '#ids-sidebar-menu-template',
      props: {
          list : Array
      },
      data: function () {
          return {
              open: false
          }
      },
      computed: {
          submenu: function () {
                  return true;
                  // problem here
              return this.children &amp;&amp; this.children.length
          }
      },
      methods: {
          toggle: function (e) {
              e.preventDefault();
              if (this.submenu)
                  this.open = !this.open
          }
      }
  });
  </code></pre>
  
  <p>Data:</p>
  
  <pre><code>var data = [
      {
          title : 'Title 1',
          url : '#',
          children: [
              {
                  title : 'Subtitle 1',
                  url : '#'
              },
              {
                  title : 'Subtitle 2',
                  url : '#'
              },
              {
                  title : 'Subtitle 3',
                  url : '#'
              }
          ]
      },
      {
          title : 'Title 2',
          url : '#'
      }
  ];
  </code></pre>
  
  <p>Vue:</p>
  
  <pre><code>var vm = new Vue({
      el : '#sidebar-menu',
      data: {
          links: data
      }
  });
  </code></pre>