javascript - 当我尝试在 react 中打印时，为什么 Prop 不显示

Question

我正在尝试传输一个简单的类进行打印，但它不起作用。

当我检查 console.log 时得到如下信息:对象{“$$typeof”:Symbol(react.element)，type:Category()，key:null，ref:null，props:{...}，_owner:{...}，_store:{...}， ……

这是我目前在 App 类上的测试结果:

return (
  <div>
    <Category category = {<Category categoryId={123} categoryName="Hohnny" />} />
  </div>
);

这是我的类别类:

import React from "react";

class Category extends React.Component {
  render() {
    console.log(this.props.category);
    return (
        <div>
            {this.props.categoryId}
        </div>
    ); // end return
  }
}

export default Category;

我做错了什么？

Answer 1

您发送 Prop 的方式有误。在 React 中发送 props 就像调用组件并将属性传递给它，但不像将组件传递给组件并期望属性可用。

这就是您必须如何调用组件并将属性传递给它

return (
     <div>
      <Category categoryId={123} categoryName="Hohnny" />
  </div>
)

编辑:

如果你想将组件作为 prop 传递，那么可以像这样传递

<Category categoryId={123} categoryName="Hohnny" category={<SomeOtherComponent />}/>