vue之click事件绑定

可以用 v-on 指令监听 DOM 事件,并在触发时运行一些 JavaScript 代码。通常来讲就是监听dom触发一些操作,这些操作(比如点击)触发后执行的动作(js)可直接写在后面。

注意:所有的v-on都可以简写为@

1.@click不光可以绑定方法,也可以就地修改data里的数据

代码示例代码如下:

v-on:click="item+=1"
<template>
  <div >
   <input type="button" value="clickme" v-on:click="item+=1"/>
    <div>{{item}}</div>
  </div>
</template>
 
<script>
export default {
  name: 'HelloWorld',
  data () {
    return {
    item:1
    }
  }
}
</script>
 
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
 
</style>

2.@click绑定多个操作的时候用;隔开

代码示例代码如下:

<el-table>
<
el-table-column fixed="right" label="操作" width="120"> <template slot-scope="scope"> <el-button @click="dialogFormVisible1 = true;row=scope.$index;onejilu=scope.row" type="text" size="small" >移除</el-button> </template> </el-table-column>
</el-table>
data() { return { dialogFormVisible1: false, row: "", onejilu: "", }; },
原文地址:https://www.cnblogs.com/yanl55555/p/11962209.html