React 和 VsCodeforwardRef Intellisense

Question

我正在尝试让 VSCode 中的智能感知适用于使用

forwardRef

的功能组件。

假设有一个这样的功能组件：

const Slider = forwardRef(({value = 0, onChange = () => { /* some function */ }}, ref) => {
  return "whatever"
})
export default Slider;

如果在其他地方使用此组件，则智能感知不会建议使用

value

和

onChange

属性。我没有使用打字稿，那么在这种情况下有没有任何解决方法可以让智能感知工作而不增加太多开销？

我刚刚找到了有关打字稿实现的建议，但没有找到这种方法的建议。

Answer 1

在这种情况下你唯一能做的就是使用 JSDoc 注释来帮助 VSCode 提出建议。像这样的东西

/**
 * @typedef {Object} SliderProps
 * @property {number} [value] - The current value of the slider.
 * @property {function(number):void} [onChange] - Callback function triggered when the value changes.
 */

/**
 * Slider component
 * @param {SliderProps} props
 * @param {React.Ref} ref - Forwarded ref for the slider element.
 * @returns {React.ReactElement} The Slider component.
 */
const Slider = forwardRef(...)