Taro 3.X 引用微信小程序插件的组件的时候，无法获取组件内trigger出来的Event，Taro 2.X可以

Naico commented 3 years ago

复现步骤

小程序插件本身有全页组件和组件两种模式，组件可以当做普通的component来引用。在Taro 3.x中，引入自定义组件的时候无法获取组件内部trigger出来的事件，造成很多时间捕捉不到。

Index.config = {
  usingComponents: {
    bag: 'plugin://ffPlugin/bag-com'
  }
}

<bag
        onHandleRedirect={onRedirect}
        onBagDataLoaded={onBagDataLoaded}
      />

'onBagDataLoaded', 'onRedirect'两个方法都无法正常被调用，无法获取组件中抛出的相应事件

期望结果

像Taro 2.X一样能获取组件内trigger出来的事件

实际结果

无法获取组件内抛出的事件

环境信息

Taro CLI 2.2.16 environment info:
    System:
      OS: macOS 10.15.7
      Shell: 5.7.1 - /bin/zsh
    Binaries:
      Node: 12.20.0 - ~/.nvm/versions/node/v12.20.0/bin/node
      npm: 6.14.8 - ~/.nvm/versions/node/v12.20.0/bin/npm
    npmPackages:
      @tarojs/components: 2.2.16 => 2.2.16
      @tarojs/components-qa: 2.2.16 => 2.2.16
      @tarojs/mini-runner: 2.2.16 => 2.2.16
      @tarojs/plugin-less: 2.2.16 => 2.2.16
      @tarojs/plugin-uglify: 2.2.16 => 2.2.16
      @tarojs/redux: 2.2.16 => 2.2.16
      @tarojs/redux-h5: 2.2.16 => 2.2.16
      @tarojs/router: 2.2.16 => 2.2.16
      @tarojs/taro: 2.2.16 => 2.2.16
      @tarojs/taro-alipay: 2.2.16 => 2.2.16
      @tarojs/taro-h5: 2.2.16 => 2.2.16
      @tarojs/taro-qq: 2.2.16 => 2.2.16
      @tarojs/taro-quickapp: 2.2.16 => 2.2.16
      @tarojs/taro-swan: 2.2.16 => 2.2.16
      @tarojs/taro-tt: 2.2.16 => 2.2.16
      @tarojs/taro-weapp: 2.2.16 => 2.2.16
      @tarojs/webpack-runner: 2.2.16 => 2.2.16
      eslint-config-taro: 2.2.16 => 2.2.16
      eslint-plugin-taro: 2.2.16 => 2.2.16
      nerv-devtools: ^1.5.7 => 1.5.7
      nervjs: ^1.5.7 => 1.5.7
      stylelint-config-taro-rn: 2.2.16 => 2.2.16
      stylelint-taro-rn: 2.2.16 => 2.2.16

imnot2 commented 3 years ago

@Naico

How did u fixed this issue ?

GQ-sunshine commented 3 years ago

@Chen-jj 遇到一样的问题，什么时候能修复呢？源码tarojs/shared中，buildThirdPartyAttr方法对on绑定的事件转为了全小写，导致编译成的小程序模版中bind的事件都是全小写，如果triggerEvent触发的事件是驼峰，将导致事件不能被触发。 BaseTemplate.prototype.buildThirdPartyAttr = function buildThirdPartyAttr (attrs) { return Array.from(attrs).reduce(function (str, attr) { if (attr.startsWith('@')) { // vue event return str + "bind" + (attr.slice(1)) + "=\"eh\" "; } else if (attr.startsWith('bind')) { return str + attr + "=\"eh\" "; } else if (attr.startsWith('on')) { // 此处转为了全小写 return str + "bind" + (attr.slice(2).toLowerCase()) + "=\"eh\" "; } return str + attr + "=\"{{i." + (toCamelCase(attr)) + "}}\" "; }, ''); }; 目前接入的微信小程序ocr插件触发的事件是驼峰的，导致不能触发ocr回调函数。