Reactjs 如何在使用React.fowardRef和useImperialiveHandle时创建ref的JSDoc？

我没有在我的reactjs项目中使用typescript，但我仍然想用JSDocs来记录我的组件

问题是我有一个带有

React.forwardRef

的功能组件，我想为ref创建一个JSDoc，因为我正在使用

useImperialiveHandle

并将不同的值传递给ref

可以使用JSDoc记录

ref

，以显示传入

useImperialiveHandle

的方法和属性？如果是，如何进行

我想要的例子在哪里

在组件中，我使用

React.fowardRef

和

useImperialiveHandle

export const Foo = React.fowardRef((props, ref) => {

    useImperativeHandle(ref, () => ({
        myMethod,
        // other methods and properties
    }))

    return <div>{/* ... */}</div>
}

export const Foo=React.fowardRef（（道具，ref）=>{
使用命令式句柄（参考，（）=>({
我的方法，
//其他方法和属性
}))
返回{/*…*/}
}

---

当使用

ref

作为当前

fooRef.current

的组件时，我想在键入

或按

Ctrl

+

空格

时查看

myMethod

或其他属性，虽然我不知道这是否是一个完美的解决方案，但对我来说有效的只是为所有属性编写一个typedefs（包括ref），然后将其传递给@type属性，所有这些都在JSDoc中。 下面是一个应该可以使用的代码片段：

从“React”导入React；
从“道具类型”导入道具类型；
/**
*@typedef{Object}RefType
*@property{Object}当前
*@property{（）=>void}current.methodOne
*@property{（）=>void}current.methodTwo
*/
/**
*@typedef{Object}Props
*@property{RefType}ref
*@property{string}值
*@property{（（event:React.ChangeEvent）=>void）|未定义}onChange
*/
/**
*@type{React.FC}
*/
导出常量输入=React.forwardRef((
道具，
/**@type{RefType}*/
ref）=>{
返回
})
Input.propTypes={
值：PropTypes.string.isRequired，
onChange:PropTypes.func.isRequired，
};
Input.displayName='Input'；

因此，当我使用该组件时，以下是我在VSCode中获得的intellisense，例如：

intellisense应该在整个项目中起作用

编辑：我应该解释为什么我包括PropTypes。我也遇到了同样的问题，并找到了一个解决方案，但我还需要开发工具来保留组件名。开发工具将显示

React.forwardRef

而不是真实的组件名。

displayName

属性将起到保持原始组件名的作用阿美

编辑：如果你需要在组件内部有自动完成功能，你可以像下面的图片链接那样完成。我已经更新了代码片段来反映这一点。

---

您能记录这些道具吗？非常感谢，我已经找了很久了