davy_yg
1 week ago
313
1
Vue

appear as {{ title }} 2

Posted 1 week ago by davy_yg

app.js

new Vue({
  el: '#app',
  data: {
    title: 'The VueJS Instance'
},
beforeCreate: function(){
  console.log('beforeCreate()');
},
created: function(){
 console.log('created()');
},
 beforeMount: function(){
	console.log('beforeMount()');
},
mounted: function(){
	console.log('mounted()');
 },
beforeUpdate: function(){
	console.log('beforeUpdate()');
},
updated: function(){
	console.log('updated()');
},
beforeDestroy: function(){
	console.log('beforeDestroy()');
},
destroyed: function(){
	console.log('destroyed()');
},
methods: function(){
	destroy: function(){
  	this.$destroy();
 }
}
});

index.html

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

<meta charset="UTF-8">

<div id="app">
	<h1>{{ title }}</h1>
	<button @click="title = 'Changed'">Update Title</button>
	<button @click="destroy">Destroy</button>
</div>

<script src="app.js"></script>

This time, I also confuse why I title still appear as {{ title }}. I have the app reference correctly:

Please sign in or create an account to participate in this conversation.