如何沿用默认导出的函数组件语法使用React forwardRef？

当然可以实现，你只需要先以函数声明的方式定义组件（同时接收props和ref两个参数），再将这个函数传入forwardRef后做默认导出，就能和你习惯的写法保持一致。

你原本的默认导出函数组件写法： #

export default function myFunc(props){
    return <input placeholder={props.placeholder} />;
}

适配forwardRef的写法： #

// 以函数声明方式定义组件，接收props和ref参数
function myFunc(props, ref){
    return <input ref={ref} placeholder={props.placeholder} />;
}

// 用forwardRef包裹后默认导出
export default forwardRef(myFunc);

这样既保留了你偏好的函数声明式写法，又实现了forwardRef的功能，语法风格和你原有的代码完全统一，不需要改用箭头函数形式。

内容的提问来源于stack exchange，提问作者Guilherme Gonçalves