实例就是在构造器外部操作构造器内部的属性选项或者方法,就叫做实例?实例的作用就是给原生的或者其他javascript框架一个融合的接口或者说是机会,让Vue和其他框架一起使用。
一、Vue和Jquery.js一起使用
只有在mounted和updated才可以用jq.没有挂载就没有dom
<script src="../asset/js/jquery-1.8.3.min.js"></script>
<div id="app">
<h1>{{msg}}</h1>
</div>
<script>
var app=new Vue({
el:"#app",
data:{
msg:"HelloWorld"
},
mounted:function(){
$("#app").html('jQuery')
});
页面显示jQuery
下载jQuery,引入文件,然后在mounted或updated引用。
二、实例调用自定义方法
<div id="app">
<h1>{{msg}}</h1>
</div>
<script>
var app=new Vue({
el:"#app",
data:{
msg:"HelloWorld"
},
mounted:function(){
$("#app").html('jQuery')
},
methods:{
add:function(){
console.log("调用了构造器内部的方法")
}
}
});
app.add();
在构造器外部,构造器名.方法名()就可以调用自定义方法。