element UI组件添加自定义参数

CSDN话题挑战赛第2期
参赛话题:学习笔记

我们在使用elmentUI组件时,使用额外的方法,来给组件添加自定义参数。

错误代码:

<el-input-number 
    v-model="num" 
    @change="numChange(myData)" 
    :min="1" 
    :max="10" 
    label="描述文字"
></el-input-number>

这里我们使用了el-input-number组件,使用该组件的 change 事件,调用自定义 numChange 方法,同时在改方法中传递 myData 参数,但是在 numChange 方法中却获取不到 myData。

通过查询组件方法,发现change 事件回调参数有两个: currentValue 和 oldValue 。

 错误代码中,每次numChange中获取的参数都是 currentValue,于是想到了,通过传参的方法,先调用 change 事件,然后在 change 事件的回调函数中,调用自定义事件,并传递自定义参数就可以解决该问题。

正确代码如下:

<el-input-number 
    v-model="num" 
    @change="(currentValue,oldValue)=>numChange(currentValue,oldValue,myData)" 
    :min="1" 
    :max="10" 
    label="描述文字"
></el-input-number>

猜你喜欢

转载自blog.csdn.net/Hello_MrShu/article/details/127305034