本节知识点
$mount方法
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0">
<title>Title</title>
<script src="js/vue.js"></script>
</head>
<body>
<div id="app">
<hello></hello>
</div>
</body>
<script>
var hello = Vue.extend({
template:`<p style="color:red;">{{message}}----{{a}}</p>`,
data:function(){
return {
message:"实例化练习"
}
},
props:["a"]
})
var vm = new hello({propsData:{a:"测试props"}}).$mount("hello");
</script>
</html>
$destroy()卸载方法
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0">
<title>Title</title>
<script src="js/vue.js"></script>
</head>
<body>
<div id="app">
<hello></hello>
</div>
<button onclick="destroy()">卸载挂载</button>
</body>
<script>
var hello = Vue.extend({
template:`<p style="color:red;">{{message}}----{{a}}</p>`,
data:function(){
return {
message:"实例化练习"
}
},
props:["a"]
})
var vm = new hello({propsData:{a:"测试props"}}).$mount("hello");
function destroy(){
vm.$destroy();
}
</script>
</html>
$forceUpdate() 更新方法
vm.$forceUpdate()
网友评论