VUE—v-for循环动态绑定不同的函数方法(图文详情)
VUE—v-for循环动态绑定不同的函数方法第一步:在v-for循环的data里写方法名,我这里有三个方法名第二步:v-for循环时click事件绑定不同的函数方法<ul><li v-for="(item, index) in datafieldset" @click="Fn(item.method)"><img...
·
VUE—v-for循环动态绑定不同的函数方法
第一步:在v-for循环的data里写方法名,我这里有三个方法名
第二步:v-for循环时click事件绑定不同的函数方法
<ul>
<li v-for="(item, index) in datafieldset" @click="Fn(item.method)">
<img :src="item.pic" alt="">
</li>
</ul>
第三步:在methods里面写Fn这个方法用来赋值data里面的方法
methods: {
Fn (method) {
this[method]()
},
wechatFn () {
this.$messagebox.confirm('', '"ZCOOl站酷"想要打开"微信"')
},
qqFn () {
this.$messagebox.confirm('', '"ZCOOl站酷"想要打开"QQ"')
},
blogFn () {
this.$messagebox.confirm('', '"ZCOOl站酷"想要打开"微博"')
}
}
这里的this[method]就是为了赋值data里的三个函数方法,现在我每个li都分别绑定了方法
然后分别写一下这三个方法
这个时候已经成功绑定,而且可以执行,看一下效果
ok了?
更多推荐
已为社区贡献16条内容
所有评论(0)