在阅读this article并编写了几个React应用之后,我仍然不明白为什么“组件”被称为组件。即我知道这是“一段代码”,但对于我来说,来自C#和Python这个词的“封装”意味着很多。在阵营我看到创建,例如,成分“UsernamePasswordComponent”,看起来像:为什么React的组件是“组件”?
class UsernamePasswordComponent extends React.Component {
render() {
return(
<div>
<input type="text" name="username"
value={this.props.username} onChange={this.props.handlerUsernameFromParentComponent} />
<input type="password" name="password"
value={this.props.password} onChange=this.props.handlerUsernameFromParentComponent />
<button onClick={this.props.handlerClickFromParentComponent}>Login</>
</div>
);
}
我被迫存放在父母(通常是root)状态password
和username
,我必须写大量的垃圾在PARENT组件来处理孩子的变化事件。我不明白。
所以最后我有以下问题:
为什么阵营提供的双向绑定这么丑法?我喜欢
LinkedStateMixin
,但它被标记为“已弃用”。为什么???为什么我必须将
paswword
和username
存储在父级状态中,而不是将其封装在子组件中,并提供一种从其获取数据的接口。或者这个组件可以用更多的反应方式重写并封装所有东西?
1)在React世界中,双向数据绑定或多或少地被忽视。统一的数据流对于复杂的应用程序更容易推理。 2)React组件通常可以放入演示文稿类别(仅显示内容)和容器类别。将设计与业务逻辑分开总是一个好主意。 – marvinhagemeister
我想你错过了关于React架构的观点。你应该实际使用的是flux架构,还是其简单的版本叫做redux。这将允许你完全分离你的组件状态。 – Sulthan