直接在组件对象上保存状态？

Question

反应文档建议将组件状态存储在其状态＆＃34;属性。但似乎也可以将组件对象本身用作状态。

例如，而不是：

{
    getInitialState:function(){
        return {firstname: this.props.firstname||"",lastname:this.props.lastname||""}
    },
    render:function(){
        return React.DOM.div({},"Hello, "+this.state.firstname+" "+this.state.lastname);
    }
}

我可以这样做：

{
    getInitialState:function(){
        this.constructor(this.props);
        return {};
    },
    constructor:function(props){
        this.firstname = props.firstname||"";
        this.lastname = props.lastname||"";
    },
    render:function(){
        return React.DOM.div({},"Hello, "+this.firstname+" "+this.lastname);
    }
}

对我而言，这看起来更清洁。但我担心这会产生任何我不知道的意外副作用。

这是个坏主意吗？它有任何缺点吗？为什么你认为React开发者甚至选择了＃34;状态＆＃34;属性？我的意思是，如果它按照我默认的方式工作，那么状态属性模式仍然可以被所有喜欢它的人使用，但那些不喜欢它的人不会甚至需要一个＆＃34; getInitialState＆＃34;功能

Answer 1

是的，您可以使用组件对象来存储状态，但状态更改时并不是一个好主意。如果在组件的生命周期中状态没有改变，我看不出为什么你不能使用这种风格的技术原因。

当组件中的状态发生变化时，此对象样式没有意义。如果没有其他逻辑覆盖默认的shouldComponentUpdate方法，则状态更改会导致重新呈现。如果可能，还会批量应用状态更改以提高性能。

这方面的重要资源是React的文档，为什么应该使用状态对象。 https://facebook.github.io/react/docs/component-api.html

来自http://code.tutsplus.com/tutorials/intro-to-the-react-framework--net-35660的图片

Answer 2

React建立在组件始终反映组件“状态”的思想之上。 当使用setState更改状态时，React将重新渲染已更改的部分。

在内部，React组件就像其他一切一样是一个javascript对象。 因此，您当然可以直接更改属性，但这不会提示您重新呈现组件。因此，您的组件不会始终反映更改的属性。

因此，即使它可以直接改变属性，它也是一个糟糕的设计模式，因为如果你需要它就很难重构。它还打破了React的标准设计模式，这将使其他开发人员更难阅读。