Vue 2.0 Hello World

by nkovacs

HTML

<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/vue-router"></script>

<div id="app">
  <p>{{ message }}</p>
  <button type="button" @click="navigate">Navigate to hash with router</button>
</div>

JavaScript

var Foo = { template: '<div>foo</div>' }
var Bar = { template: '<div>bar</div>' }

var routes = [
  { path: '/foo', component: Foo },
  { path: '/bar', component: Bar }
]

var router = new VueRouter({
  routes: routes
})

router.beforeEach(function(to, from, next) {
	console.log(to)
	next()
})

router.afterEach(function() {
  setTimeout(function() {
    console.log(window.location.href)
  }, 0)
})

new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js!'
  },
  methods: {
  	navigate: function() {
      router.push({
        path: "/foo",
        hash: "somehash"
      })
    }
  }
})