vue事件中如何使用event对象,vue中的$event

　　本文主要介绍Vue事件的$event parameter=event value的案例，有很好的参考价值。希望对大家有帮助。来和边肖一起看看吧。

template

　　el-table :data=dataList

　　el-table-column标签=id 属性=id/el-table-column

　　El-table-column label= name prop= name

　　模板v-slot=props

　　el输入号码

　　:min=0

　　v-model=props.row.count

　　@change=updateProduct($event)

　　size=mini

　　/El-输入-数字

　　/模板

　　/El-表格-列

　　/el-table

Script 部分

　　导出默认值{

　　data() {

　　返回{

　　数据列表：[

　　{ id: 1，姓名： 001 ，计数：1 }，

　　{ id: 2，名称： 002 ，计数：2 }，

　　{ id: 3，姓名： 003 ，计数：3 }，

　　]

　　}

　　},

　　方法：{

　　更新产品(值){

　　console.info(值)

　　}

　　}

　　}

　　补充：vue学习笔记：事件中的$event对象作用

　　vue中的Click events或者其他事件可以通过在events中添加$event等方式获取标签元素的dom或者修改标签所指向的属性。具体用法如下：

　　1.dom元素可以通过$event获得。

　　html:

　　按钮数据-get= data button @ click= getRvent($ event)获取事件对象/按钮

　　首先，让我们打印$event对象，看看对象中有哪些属性，如下图所示。

　　SrcElement是当前的标签元素，根据该属性可以得到当前点击事件的标签元素。

　　例如，我们可以对获得的元素进行操作，就像原生js一样，如下所示：

　　//获取事件对象e。

　　获取(e){

　　console . log(e)；

　　e . src element . style . background= red ；

　　}

　　点击之前：

　　点击后：

　　2.此外，我们还可以修改标签本身的属性，比如改变按钮的文本值。此时$event下的textContent用于修改。

　　单击按钮之前：

　　点击按钮后：

　　3.我们还可以通过$event获取标签custom的属性值，如下所示：

　　Html代码：

　　按钮数据-get= data button @ click= getRvent($ event)获取事件对象/按钮

　　这个按钮标签有一个自定义属性data-get，可以根据$event的target.dataset.get属性获取。

　　您可以在控制台上打印它，如下所示：

　　其实有时候我们可以利用元素本身的属性来操作，而不是添加类等操作，来减少代码的冗余，提炼代码。

　　以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。如有错误或不足之处，请不吝赐教。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。