javascript - ReactJS 编写无状态函数注释

标签 javascript reactjs code-documentation

ReactJS 无状态函数推荐的注释方式是什么?

假设我有以下代码:

export const LoginForm = ({ submitting, handleSubmit }) => (
  <form onSubmit={handleSubmit(submit)}> ...(code)... </form>
));

文档注释应该是什么样子的?

我的第一个想法是:

/**
 * Form for user login
 * @param {bool} submitting Shows if form submitting is in progress
 * @param {function} handleSubmit Form submit callback function
 */

但这是不正确的,因为 submittinghandleSubmit 不是 LoginForm 函数的实际参数。它们只是 props 参数的键。 另一方面,将 props 记录为 LoginForm 的参数似乎毫无意义,因为每个 React 组件都有 props 作为参数,并且 props 键是函数中最重要的部分。

是否有任何官方指南? (我没找到)


编辑

我还定义了 PropTypes:

LoginForm.propTypes = {
  submitting: PropTypes.bool,
  handleSubmit: PropTypes.func.isRequired,
};

也许这是 Prop 相关文档的地方?如果是这样,它应该是什么样子?有什么标准吗?

最佳答案

你可以在属性名前指定props对象:

/**
 * Form for user login
 * @param {object} props Component props
 * @param {bool} props.submitting Shows if form submitting is in progress
 * @param {function} props.handleSubmit Form submit callback function
 */
export const LoginForm = ({ submitting, handleSubmit }) => (
  <form onSubmit={handleSubmit(submit)}> ...(code)... </form>
));

有关详细信息,请参阅 @param Parameters With Properties 部分中的 wiki 页面。

关于javascript - ReactJS 编写无状态函数注释,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38717783/

相关文章:

javascript - 延迟加载图像以加快网站加载速度

javascript - 如何跟踪JavaScript执行性能?

reactjs - 使用 Jest 运行测试时无法访问窗口属性

javascript - react 路由器 4 嵌套组件无法正常工作

Python urllib.request.Request参数 'data'对象类型

javascript - Angular 2路由解析不同的组件

reactjs - react 查询customHook refetchOnWindowFocus

Python:如何在包级帮助菜单中嵌入所有文档字符串帮助?

ios - NSNotFound 的可用性如何?

javascript - 将其设置为 null 并在一行中获取可变数据