REACT js 中道具和状态的混淆

Question

这里有一个简单的问题。我现在有 2 个 classes，class AExample 和 BExample。所以现在，我在 class AExample 的渲染部分创建了一个 class BExample 的实例。我在渲染部分的 class A 中添加了这段代码。

<BExample
state= {this.state}
/>

所以在 class B 示例中，当我尝试

console.log(props);

在道具值中，我正在获取状态值。现在的问题是我很困惑，到底是BExample的状态还是AExample的状态？你们国家值代表哪个class？如果是，为什么会这样？

Answer 1

看，AExample 的 state 现在被设置为 BExample 组件的名为 state 的道具。

作为属性的组件的任何道具在反应中被称为附加组件的道具。

所以，

<BExample
state= {this.state}
/>

在上面的例子中，{this.state} 是 AExample 的状态，但 state 是 BExample 的 prop。这就是为什么当您登录 props 时它会显示 AExample.

的状态值

Answer 2

在 ReactJS 中，父组件的状态成为子组件的 props。

因此，在 A 组件中，您将 'A's State' 传递给 'B' component。

B 现在是 props。因此，在 B 中，如果您 console.log(props) 您将获得 'A's State' 的值。

Confusion in props and state in REACT js