el-input的@change事件自定义传参
在Vue中,你可以通过使用v-bind
或简写:
来绑定一个对象到el-input
的@change
事件,从而在触发事件的时候传递自定义参数。
下面是一个简单的例子:
<template>
<el-input
v-model="inputValue"
@change="handleChange"
></el-input>
</template>
<script>
export default {
data() {
return {
inputValue: ''
};
},
methods: {
handleChange(value, customParam) {
console.log('Input value changed to:', value, 'with custom param:', customParam);
}
}
};
</script>
在这个例子中,handleChange
方法将会在输入框的内容变化时被调用,并且会接收到两个参数:当前输入框的值和自定义参数customParam
。
如果你想要传递自定义参数,你可以在@change
绑定的方法中直接返回一个函数,该函数会在事件触发时被调用,并且可以接收到你想要传递的参数。
例如:
<template>
<el-input
v-model="inputValue"
@change="event => handleChange(event, customParam)"
></el-input>
</template>
<script>
export default {
data() {
return {
inputValue: '',
customParam: 'someValue'
};
},
methods: {
handleChange(event, customParam) {
console.log('Input value changed to:', event.target.value, 'with custom param:', customParam);
}
}
};
</script>
在这个例子中,我们通过一个箭头函数来创建一个新的函数,这个新的函数在被调用时会接收到event
对象和customParam
。
评论已关闭