使用HOC不支持包裹函数组件, 会被编译为React.createElement

[ChangerHe]

问题描述

使用HOC不支持包裹函数组件, 会被编译为React.createElement

复现步骤

import Taro from '@tarojs/taro';
import useTokenProcessor from '../hooks/useTokenProcessor';

const withUseTokenProcessor = (OutComponent) => {
  return props => {
    const [isLoading, isNeedAuth] = useTokenProcessor();
    return (
      <OutComponent isLoading={isLoading} isNeedAuth={isNeedAuth} {...props} />
    );
  };
};

export default withUseTokenProcessor;

将此HOC引入页面使用后, 出现报错, 提示Uncaught ReferenceError: React is not defined

可以看到, 这个HOC被编译成为了一个使用React.createElement生成的组件

[taro-bot]

CC @luckyadam

[taro-bot]

欢迎提交 Issue~

如果你提交的是 bug 报告，请务必遵循 Issue 模板的规范，尽量用简洁的语言描述你的问题，最好能提供一个稳定简单的复现。🙏🙏🙏

如果你的信息提供过于模糊或不足，或者已经其他 issue 已经存在相关内容，你的 issue 有可能会被关闭。

Good luck and happy coding~

[ChangerHe]

主要的想法是想将hooks的逻辑复用到原有的class组件中, 所以使用hoc

[luckyadam]

小程序端暂时不支持 HOC，因为不能劫持 render 方法

[afishhhhh]

@luckyadam 有计划支持 hoc 吗