如何正确记录 React Native 组件的 Props 参数

Question

我正在尝试为我正在开发的应用程序编写 JSDocs，但无论我如何记录组件函数，文档摘要显示该函数接受“any”类型的参数 Prop，并且不会显示正确的摘要道具应该包含哪些内容。

例如，在一个函数上，我将此作为我的文档：

/**
 * JSX Component for displaying selected images in a fullscreen Modal
 * @typedef {object} props
 * @prop {boolean} modalVis state variable boolean for controling modal visibility
 * @prop {callback} setModalVis callback to state function to set modalVis
 * @prop {string} imageUri string uri of the image to be displayed
 * @returns 
 */
const DisplayModal = (props) => {...}

但是当我将函数悬停在代码中的其他位置时，它会给出以下文本：

const DisplayModal: (props: 任意) => JSX.Element

@typedef - 道具

@返回

是否有一种正确的方法来记录 Props 的预期内容，以便查看该函数将提供所需的信息？

Answer 1

它应该类似于以下代码片段，使用@param而不是@typedefand @prop：

/**
 * JSX Component for displaying selected images in a fullscreen Modal
 * @param {object} props
 * @param {boolean} props.modalVis state variable boolean for controling modal visibility
 * @param {() => void} props.setModalVis callback to state function to set modalVis
 * @param {string} props.imageUri string uri of the image to be displayed
 * @returns
 */
  const DisplayModal = (props) => {...}