VUE自定义事件传递默认参数同时,传入自定义参数

最近在开发时遇到一个问题,使用 element-ui 组件库的 input-number 组件时,自定义其 @change 事件,@change 事件默认传入 newVal, oldVal 两个参数,可以用如下写法

methods: {
    numberChanged(newVal, oldVal) {
      console.log(newVal, oldVal); 
    },

但如果此时,除默认参数 newVal, oldVal 外,需要再传递一个自定义参数 ar1 该如何处理。
首先考虑到使用 $event,

methods: {
    numberChanged(ar1, e) {
      console.log(ar1, e); 
    },

但此时 e=newVal,即默认的第一个参数,默认的第二个参数 oldVal 仍无法传递。

网上也没有找到相应解决办法,VUE自定义事件中,关于子组件传递多个参数的同时,父组件又要传递额外的参数的实践 给出了使用对象传递的方法,即将第一个默认参数和第二个默认参数合并成一个对象,只传递一个默认参数,但该方法不仅繁琐,而且局限性较大。

今天突发奇想到一个新的方法,如下:

methods: {
    numberChanged(ar1, newVal, oldVal) {
      console.log(ar1, newVal, oldVal); 
    },

相较之下显得简洁的多,故在此记录,供大家参考,也希望集思广益,看有无新的更简洁的方法。

你可能感兴趣的:(vue.js)