vue方法绑定
方法绑定 {{reverseMessage}} new Vue({ el:"#app", data:{ message:"hello", a:1, b:2 }, methods:{ //定义方法对象 fun1:function(){ this.a
·
方法绑定
<div id="app"><input type="button" v-on:click="fun1" />
<p>{{reverseMessage}}</p>
<h1>{{message | format("元")}}</h1> //过滤器调用,可加括号传入参数
</div><javascript>
new Vue({
el:"#app",
data:{
message:"hello",
a:1,
b:2
},
methods:{ //定义方法对象
fun1:function(){
this.a++
}
},
filters:{ //过滤器
format:function(value,type){
return value+"world"+type; //type为传入的‘元’
}
},
mouted:{ //文档加载完成立即调用相当于window.onload
alert("a");
}
watch:{ //监听变化'a':function(){
alert(this.a);
}
},
computed:{ //computed效果与methods一样,但基于依赖缓存( message变化时才重新加载),而methods页面重新渲染时就会重新调用,computed效率更高
reverseMessage:function(){
return this.message.spilt("").reverse().join("");
}
}
})
</javascript>
更多推荐
已为社区贡献4条内容
所有评论(0)