[2022-07-08]记录一次taro2的父组件调用子组件方法的问题

如题.. 最近要把一个项目的首页改成公司小程序原生化.
小程序使用taro2框架来搭建的. 需要一些学习成本
再重构的过程 页面用hooks 编写
很正常的遇到了父组件调用子组件方法的问题
随后又很正常的按照react hooks的方法引入了forwarRef包装子组件 useImperativeHandle 暴露ref指向 传递给父组件调用的方法..
然后... 编译报错了 如图

没想到吧 老铁.png

这个错误和导出组件的名称错误一致. 一开始怀疑是包装错误. 随后更换了几种姿势. 编译器依旧不认可.. 随后进入了漫长的debugger...
再一次尝试中发现

import Taro,{forwardRef} from '@tarojs/taro';
const child = (props)=>{
  console.log('forwardRef',forwardRef)
}

// forwardRef undefined

居然导出的函数是undefind???
去node_modules 看源码 发现确实没有这个api 这下尴尬了..
经过几个小时的折腾.. 终于找出了正确的姿势

ps: 自己研究出来的 不一定是正确的方式

//父组件
import Taro, { useRef } from '@tarojs/taro';
const Dom = useRef(null); // 产品子组件
// ...某个函数调用
Dom.current.onTest()

...
 // 这里用ref不行 只能用自定义属性


// 子组件
import Taro, { useImperativeHandle } from '@tarojs/taro';
const child = ({oRef})  => { // 结构props取值
  useImperativeHandle(oRef,() => ({
    onTest:()=>{
      console.log('子组件调用了哦');
    }
  }));
}

这样就可以正常调用了... 希望其他遇到此问题的同学可以避坑
taro官网 好像taro3是支持了forwarRef.
taro2还不支持.. 项目还不太好升级 哎..