feat(vue3): 支持vue3类组件

[agileago]

这个 PR 做了什么? (简要描述所做更改)
支持vue3类组件

这个 PR 是什么类型? (至少选择一个)

• 错误修复(Bugfix) issue id #
• 新功能(Feature)
• 代码重构(Refactor)
• TypeScript 类型定义修改(Typings)
• 文档修改(Docs)
• 代码风格更新(Code style update)
• 其他，请描述(Other, please describe):

这个 PR 涉及以下平台:

• 所有小程序
• 微信小程序
• 支付宝小程序
• 百度小程序
• 字节跳动小程序
• QQ 轻应用
• 京东小程序
• 快应用平台（QuickApp）
• Web 平台（H5）
• 移动端（React-Native）

[Chen-jj]

@agileago 麻烦提供一下修复前使用类组件失败的 demo

[agileago]

@Chen-jj thanks https://github.com/agileago/vue3-taro

[Chen-jj]

@agileago 原来是有这么一个属性，难怪我用 vue-class-component 测试没有问题，学习了~

麻烦 taro 根目录运行一下 lerna run updateSnapshot --scope=@tarojs/mini-runner更新一下 snapshot 再提交一下哈

[agileago]

@Chen-jj mac air m1 跑不起来...

我到公司弄

[agileago]

vue-class-component 弃坑了吧，好久都没人维护了 vuejs/vue-class-component#569

[agileago]

@Chen-jj ok了

[Chen-jj]

@agileago 666~感谢贡献

[agileago]

@Chen-jj VUE3文档里面有个限制应该可以解除
https://taro-docs.jd.com/taro/docs/vue3#%E5%85%B6%E5%AE%83%E9%99%90%E5%88%B6

这个其实就是相当于 ref 转发，react里面有 forwardRef实现， 而vue3中可以用 expose 实现

// 处理forwardref
export function useForwardRef() {
  const instance = getCurrentInstance()!
  function forwardRef(ref: any) {
    instance.exposed = ref
    instance.exposeProxy = ref
  }
  return forwardRef
}


// 这是 vue3中包装组件
export default function createComponent (name, classNames = []) {
  return {
    emits: ['tap'],
    setup (props, { slots, emit, attrs }) {
      const forwardRef = useForwardRef()
      return () => (
        h(
          `${name}-core`,
          {
            ref: forwardRef,
            class: ['hydrated', ...classNames],
            onClick (e) {
              emit('tap', e)
            }
          },
          slots
        )
      )
    }
  }
}

[agileago]

@Chen-jj 没看到？

[Chen-jj]

@agileago 学习了~ 有空的话可以另外提个 PR 哈~

[agileago]

好的，我怕这是 breakchange, 不知道你merge不

[Chen-jj]

合的，breaking changes 跟 minor 版本发布哈

[agileago]

ok