自定义组件的自定义方法传多参数

[ctocto]

uni-app 转 微信小程序
自定义组件的自定义方法 调用函数组装多参数问题。
额外参数为 父组件上绑定的数据是没有问题的，在如v-for ：for-item 参数才会有问题
问题描述
一个自定义组件：

父组件调用自定义组件（CheckableTag）：


执行，打印输出：
true
undefined
参数option 没有传过来，查看编译结果：

option 参数指向错误。

怀疑是@change="(checked) => handleChange(checked, option)" 语句箭头函数的原因，
改为：@change="function (checked) { handleChange(checked, option) }" handleChange 方法输出结果：
undefined
{label: "10km内", value: "10km"}
参数checked 又不存在了，十分不解，各种调试之后发现只要在 handleChange(checked, option) 随便加一条或多条语句就正常了，如：

这样达到想要的结果，两个参数都传过来了。

查看编译结果发现，这里多条语句与单条语句的编译结果是不一样的：
单语句：

// TagSelect.wxml
<checkable-tag vue-id="{{'230ddefb-1-'+__i0__}}" checked="{{option.value===selected.value}}" data-event-opts="{{[['^change',[['handleChange',['$0','$1'],['checked',[['options','value',option.value]]]]]]]}}" bind:change="__e" class="data-v-e4f6e12a" bind:__l="__l" vue-slots="{{['default']}}">{{option.label}}</checkable-tag>

多语句：

// TagSelect.wxml
<checkable-tag vue-id="{{'230ddefb-1-'+__i0__}}" checked="{{option.value===selected.value}}" data-event-opts="{{[['^change',[['e0']]]]}}" data-event-params="{{({option})}}" bind:change="__e" class="data-v-e4f6e12a" bind:__l="__l" vue-slots="{{['default']}}">{{option.label}}</checkable-tag>

// TagSelect.js
var render = function() {
  var _vm = this
  var _h = _vm.$createElement
  var _c = _vm._self._c || _h
  if (!_vm._isMounted) {
    _vm.e0 = function(checked, option) {
      var _temp = arguments[arguments.length - 1].currentTarget.dataset,
        _temp2 = _temp.eventParams || _temp["event-params"],
        option = _temp2.option

      var _temp, _temp2

      123
      _vm.handleChange(checked, option)
    }
  }
}

多语句与箭头函数形式的写法类似都会提取成单独的方法来调用。

系统信息:

• 发行平台: 微信小程序
• 操作系统 windows10
• HBuilderX版本 2.8.11.20200907
• uni-app版本
• 设备信息 最新版【微信开发者工具】

补充信息
代码编译可能存在问题

[ctocto]

我目前解决方式是：

直接把handleChange的内容写在模板里

[zhetengbiji]

你确认这个写法 @change="(checked) => handleChange(checked, option)" 在H5端是正常的吗？

[ctocto]

你确认这个写法 @change="(checked) => handleChange(checked, option)" 在H5端是正常的吗？

这种写法使用微信开发者工具查看是不正常的，option 参数传不过来的。

上图这种写法才正常。

[zhetengbiji]

你确认这个写法 @change="(checked) => handleChange(checked, option)" 在H5端是正常的吗？

这种写法使用微信开发者工具查看是不正常的，option 参数传不过来的。

上图这种写法才正常。

已确认箭头函数表达式在小程序有问题，不过我这测试H5也有问题，所以和你确认一下你之前测试在H5是否正常

[ctocto]

你确认这个写法 @change="(checked) => handleChange(checked, option)" 在H5端是正常的吗？

这种写法使用微信开发者工具查看是不正常的，option 参数传不过来的。

上图这种写法才正常。

已确认箭头函数表达式在小程序有问题，不过我这测试H5也有问题，所以和你确认一下你之前测试在H5是否正常

明白了，我刚刚调试了一下，结果是：箭头函数方式handleChange方法没有被调用，而我在微信小程序上能正常运行的function （）{...} 方式也报 语法错误了。

[zhetengbiji]

你确认这个写法 @change="(checked) => handleChange(checked, option)" 在H5端是正常的吗？

这种写法使用微信开发者工具查看是不正常的，option 参数传不过来的。

上图这种写法才正常。

已确认箭头函数表达式在小程序有问题，不过我这测试H5也有问题，所以和你确认一下你之前测试在H5是否正常

明白了，我刚刚调试了一下，结果是：箭头函数方式handleChange方法没有被调用，而我在微信小程序上能正常运行的function （）{...} 方式也报 语法错误了。

好的，那和我这测试结果一致