Vue 事件参数传递

1. 问题

组件内部抛一个事件

1
2
3

onChange (value) {
  this.$emit('OnChange', value)
}

外部使用时监听，并且执行一个回调

<tag @onChange="log"></tag>
<script>
  methods: {
    log (value) {
      console.log(value)
    }
  }
</script>

value

<tag @onChange="log('change')"></tag>
<script>
  methods: {
    log (value) {
      console.log(value)
    }
  }
</script>

'change'

既返回原始value，也返回字符串

1	'change' + value

模板式写法无法做到，只能这样写

<tag @onChange="log"></tag>
<script>
methods: {
  log (value) {
    console.log ('change' +  value)
  }
}
</script>

使用函数式组件也许可以，还没有尝试

把onChange本身传递的value作为函数的参数向下传递

<tag @onChange="(value) => log('change'+value)"></tag>
<script>
methods: {
  log (value) {
    console.log (value)
  }
}
</script>

1	'change' + value