JSFiddle - React, Tailwind, and code Playground

by hunterliu

HTML

<div id="app">
	<p>{{msg}}</p>
</div>

JavaScript

var vm = new Vue({
  data: {
    msg: 'Hello Vus.js'
  },
  beforeCreate() {
    console.log('beforeCreate 被執行');
  },
  created() {
    console.log('created 被執行');
  },
  beforeMount() {
    console.log('beforeMount 被執行');
  },
  mounted() {
    console.log('mounted 被執行');
  },
  beforeUpdate() {
    console.log('beforeUpdate 被執行');
  },
  updated() {
    console.log('updated 被執行');
  },
  beforeDestroy() {
    console.log('beforeDestroy 被執行');
  },
  destroyed() {
    console.log('destroyed 被執行');
  }
});

setTimeout(function() {
	vm.$mount('#app');
}, 3000)

setTimeout(function() {
	vm.$data.msg = 'change msg';
}, 6000)

setTimeout(function() {
	vm.$destroy();
}, 9000)