初始化反应组件状态

时间:2016-12-14 01:15:57

标签: javascript reactjs

我遇到了一些反应代码,它们在类中定义了一个组件状态,如下所示:

// Snippet 1
class Sample extends React.Component {
    state = {
        count: 0
    }
}

我学习React的方法是在类的构造函数中声明状态:

// Snippet 2
class Sample extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            count: 0
        };
    }
}

我能想到的唯一区别是初始化构造函数中的状态将保证状态在组件生命周期中正确初始化。

上述两个代码段之间有什么区别?在代码段1中,可以安全地假设在初始化类时正确设置状态吗?

2 个答案:

答案 0 :(得分:5)

您正在查看的是ES7+ Property Initializers。它是这样做的,因为Facebook知道Javascript将来会改变。他们希望能够应对这些变化。

  

根据facebook ES7 + Property Initializers

     

等等,分配给属性似乎是一种非常迫切的方式   定义类!不过,你是对的,我们是这样设计的   因为它是惯用的。我们完全期望更具声明性的语法   属性初始化到达未来版本的JavaScript ....

这是Facebook link 还有更多信息here

也是Link to the proposal

答案 1 :(得分:0)

它只是一种语法糖,使班级看起来更干净了https://babeljs.io/docs/plugins/transform-class-properties/