Vue2 Starter

ES6 + Vue.js jsFiddle Starter Template by Christian Gambardella http://gambardella.info/2016/11/03/jsfiddle-starter-for-vue-js/

by Dave Stewart

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.2.3/css/bulma.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.4/vue.js"></script>
<div id="app">
  <pre>{{ name }}</pre>
  <pre>{{ embedded.user.name }}</pre>
  <pre>{{ embedded.user._embedded.user.name }}</pre>
</div>

SCSS

#app {
  margin-bottom: 20px
}

#note {
  max-width: 340px
}

Babel + JSX

window.app = new Vue({
	data () {
  	return {
    "_links": {
        "self": {
            "href": "users/2"
        }
    },
    "name": "Name 2",
    "age": 23,
    "_embedded": {
        "user": {
            "_links": {
                "self": {
                    "href": "users/3"
                }
            },
            "name": "Name 3",
            "age": 42,
            "_embedded": {
                "user": {
                    "_links": {
                        "self": {
                            "href": "users/4"
                        }
                    },
                    "name": "Name 4",
                    "age": 24,
                    "_embedded": {
                        "user": {
                            "_links": {
                                "self": {
                                    "href": "users/5"
                                }
                            },
                            "name": "Name 5",
                            "age": 62
                        }
                    }
                }
            }
        }
    }
}
  },
  
  computed: {
    hello () {
      return `Hello ${this.name}`
    },
    
    embedded () {
    	return this.$data._embedded
    }
  }
})

app.$mount('#app')