事件参数
事件参数可以获取event
对象和通过事件传递数据
获取event
对象
<template>
<button@click="addCount">点击</button><p>count is: {{ count }}</p><p>{{ coutent_e }}</p>
</template>
<script>export default{data(){return{count:0,coutent_e:'',}},methods: {addCount(e) {this.coutent_e=e;this.count++}
}
}</script>
当点击后触发事件:
事件传参
<template>
<h3>事件传参</h3>
<p @click="showName(name)" v-for="(name,index) in names" :key="index">{{ index+1 }}--{{name}}</p></template>
<script>export default{data(){return{
names:["张三","李四","王五"]}
},
methods:{showName(name){console.log("点击标签:"+name)}
}
}</script>
运行结果:
目的:点击事件进行传参
传递参数过程获取event
<template>
<h3>事件传参</h3>
<p @click="showName(name,$event)" v-for="(name,index) in names" :key="index">{{ index+1 }}--{{name}}</p></template>
<script>export default{data(){return{
names:["张三","李四","王五"]}
},
methods:{showName(name,e){console.log("点击标签:"+name+ " e: "+e)}
}
}</script>
运行结果: