JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.18/vue.min.js"></script>
<div id="app">
  <ul>
    <li v-for="item in items" v-if="item!==undefined && item!=null">
      <p>{{item.title}}</p>
      <ol>
        <li v-for="child in item.children" v-if="child!==undefined && child!=null">
          <p>{{child.subtitle}}</p>
        </li>
      </ol>
    </li>
  </ul>
</div>

JavaScript

new Vue({
	el: '#app',
  data: {
  	items: {
    	1: {
        id: 1,
        title: "This should be rendered",
        children: {
          100: {
            id: 100,
            subtitle: "I am a child"
          },
          101: null
        }
      },
      2: null,
      3: {
        id: 3,
        title: "Should should be rendered as well",
        children: {}
      }
    }
  }
})