事件参数

事件参数可以获取event对象和通过事件传递数据

获取event对象

<template><button @click="addCount">Add</button><p>Count is: {{ count }}</p>
</template>
<script>
export default {data() {return {count:0}},methods:{addCount(e){e.target.innerHTML = "Add" + this.countthis.count+=1}}
}
</script>

传递参数

<template><button @click="addCount('hello')">Add</button><p>Count is: {{ count }}</p>
</template>
<script>
export default {data() {return {count:0}},methods:{addCount(message){console.log(message);this.count+=1}}
}
</script>

获取列表中的内容

<template><p @click="getNameHandle(item)" v-for="(item,index) in names" :key="index">{{ item }}</p>
</template>
<script>
export default {data() {return {names:["iwen","ime","frank"]}},methods:{getNameHandle(name){console.log(name);}}
}
</script>

传递参数过程中获取event

<template><p @click="getNameHandle(item,$event)" v-for="(item,index) in names" :key="index">{{ item }}</p>
</template>
<script>
export default {data() {return {names:["iwen","ime","frank"]}},methods:{getNameHandle(name,e){console.log(name,e);}}
}
</script>

实时效果反馈

1. 在Vue中，传递参数过程中获取event对象，写法正确的是：

A @click="getNameHandle(item)"

B @click="getNameHandle(item,$event)"

C @click="getNameHandle($event,item)"

D @click="getNameHandle()"

答案

1=>B