React组件传递Props时控制台输出undefined问题排查

核心问题 #

你完全搞反了props的传递和接收逻辑：

• 实际需要使用props的AnotherHeading组件，你在App里通过别名RandomTag导入后没传任何属性，所以它拿到的props是undefined，对应渲染位置自然无内容
• 你给**根本没接收props的AnotherHeading2、AnotherHeading3**传递了name和text属性，这属于无效操作，组件不会处理这些属性

修复步骤 #

1. 找到App组件中使用RandomTag（即AnotherHeading的导入别名）的地方，给它传递需要的props：

   // 示例：根据AnotherHeading需要的属性传递对应值
   <RandomTag name="你的名称" text="要显示的文本" />
   

2. 删掉App组件中给AnotherHeading2、AnotherHeading3添加的name、text属性——这些组件没接收props，传了也不会生效，属于冗余代码

额外提示 #

• 组件只有在定义时声明接收props，才能使用外部传递的属性；未声明接收的组件，即使传了props也无法读取
• 可以给组件添加props校验（比如用PropTypes或TypeScript），能提前发现这类传递错位的问题

内容的提问来源于stack exchange，提问作者Prajjawal Deep Yadav