Vue---v-bind、v-on、this语法

1、v-bind: 是Vue中提供用于绑定属性的指令," v-bind: " 指令可以被简写为 " : ",其中用 “v-bind:” 绑定的属性中的值为data函数中的属性名,这个属性名可以理解为变量,在绑定的html属性中其还可以添加合法的Js表达式。
用法如下:

 <input type="button" value="按钮" v-bind:title="msg+ '123'">
 <input type="button" value="按钮" :title="msg+ '123'">
 以上两种方式均可

2、v-on: 事件绑定属性,通常与click配合使用," v-on "可简写为 " @ "

<input type="button" value="按钮2" v-bind:title="mytitle" v-on:click="show">

3、this: 在函数中,如果想要获取data上的数据,或者想要调用method中的方法,必须通过this.数据属性名 或 this.方法名 来进行访问。

lang: function(){

方式一:
var _this = this;
setInterval(function(){
console.log(this.msg);
//获取到头的第一个字符
var start = _this.msg.substring(0,1);
//获取到 后面的所有字符
var end = _this.msg.substring(1);
//重新拼接得到新的字符串,并赋值给 this.msg
_this.msg = end + start;
 },400)
方式二:
setInterval( () =>{
console.log(this.msg);"
//获取到头的第一个字符
var start = this.msg.substring(0,1);
//获取到 后面的所有字符
var end = this.msg.substring(1);
//重新拼接得到新的字符串,并赋值给 this.msg
this.msg = end + start;
},400)
}
发布了33 篇原创文章 · 获赞 7 · 访问量 3238

猜你喜欢

转载自blog.csdn.net/GaoXiR/article/details/103708687