实例就是在构造器外部操作构造器内部的属性选项或者方法，就叫做实例。
$mount方法
$mount方法是用来挂载我们的扩展。
这里我们作了jspang的扩展，然后用$mount的方法把jspang挂载到DOM上，我们也生成了一个Vue的实例，直接看代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="../assets/js/vue.js"></script>
<title>Examples Method Demo</title>
</head>
<body>
<h1>Examples Method Demo</h1>
<hr>
<div id="app">
{{message}}
</div>
<script type="text/javascript">
var jspang = Vue.extend({
template:`<p>{{message}}</p>`,
data:function(){
return {
message:'Hello ,I am JSPang'
}
}
})
var vm = new jspang().$mount("#app")
</script>
</body>
</html>
用Vue.extend()方法扩展了vue实例，然后通过$mount挂载到DOM上。
$destroy() 卸载方法
我写了一个button按钮，点击后卸载整个挂载。
<p><button onclick="destroy()">卸载</button></p>
function destroy(){
vm.$destroy();
}
$destroy()后边必须要有括号，没有括号是无用的。
$forceUpdate() 更新方法
vm.$forceUpdate()
$nextTick() 数据修改方法
当Vue构造器里的data值被修改完成后会调用这个方法，也相当于一个钩子函数吧，和构造器里的updated生命周期很像。
function tick(){
vm.message="update message info ";
vm.$nextTick(function(){
console.log('message更新完后我被调用了');
})
}
网友评论