Vue 2.0 Hello World

by alpac

HTML

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

<div id="app0">
  <p>{{ message }}</p>
</div>

<div id="app1">
  <p>{{ message }}</p>
</div>

<div id="app2">
  <p v-cloak>{{ message }}</p>
</div>

CSS

[v-cloak] {
  display: none;
}

JavaScript

new Vue({
  el: '#app0',
  data: {
    message: 'Timeout: 0'
  }
})

setTimeout(function() {
  new Vue({
    el: '#app1',
    data: {
      message: 'Timeout: 2000'
    }
  })
}, 2000)

setTimeout(function() {
  new Vue({
    el: '#app2',
    data: {
      message: 'Timeout: 3000, v-cloak'
    }
  })
}, 3000)