简单易懂的React魔法(12):State和单一数据源原则

在我们进一步讨论之前,有个重要的理论你需要注意。别担心,我会长话短说。

当你开始的时候,可能认为让一个组件拥有state是一件好事,毕竟它将功能和相关数据保存在一个对象中,对吧。

确实,通过这种方式来使组件之间相互独立是很有用的方法,可以将大型应用程序分解成更小的部分,但同时也会将程序变得非常复杂。这些数据存在哪里?它是冗余的么?如果它是冗余的,如何保证当数据变化时所有的数据都会更新?当你的应用像是整个facebook那么大的时候,他们有超过10000个react组件。这会产生极大的混乱。

经验丰富的react开发人员的解决方式是,遵从单一数据源原则。你的所有组件应该有一个主状态,然后将这个状态以props的形式传给子组件。

使用这种技术,当主状态的任何一部分发生改变,它会自动更新以这部分为props的子组件,这种变化将会从上到下到达子组件,这是同步方法,不会重复。

在完美的react组件中,很少有组件有state,所以react有一个特殊的语法来创建一种只有render()方法的组件,它们不含有任何state,它们只是接受一个props然后渲染它。下面给出一个简单的例子:

const FunctionalTest = (props) => {
    return {props.message};
};

一旦你保存它,就可以像其他组件一样使用它。


别强迫自己逃避使用state,要成为一个务实的程序员,该用的时候就用。

你可能感兴趣的:(简单易懂的React魔法(12):State和单一数据源原则)