将属性传递给递归模板？

Question

有没有比使用递归模板时再次重新传递所有属性更优雅的解决方案？

<!-- CommentList.js -->
<Comment comment="comment" property="one" property="two"></Comment>

<!-- Comment.js -->
<p>{comment.message}</p>

<!-- loop over comment.children (more comments, same properties) -->
    <Comment comment="comment" property="one" property="two"></Comment>
<!-- end loop -->

Answer 1

如果要传递属性可以使用JSX spread attributes将父控件的属性注入指定元素：

语法类似于 EcmaScript 6 中的语法（以及 7 中提出的语法）：{...props}。

例如，通过使用 this.props，您可以将父项 class 的所有属性复制到子项中。（它也可能是 {...myObj} ......它会从该示例中名为 myObj 的对象复制值。）

因此，在您的示例中，它可能是：

return <Comment {...this.props} extra="stuff" />;

Here 是更多详细信息以及您可以考虑的其他一些选项。

将属性传递给递归模板？

Pass properties to recursive templates?

reactjs