Question

我是新的反应，我注意到我们使用this.setState()而不是使用super.setState()请我清楚解释为什么我们用它来调用超类方法？例如：

class Checkbox extends React.Component {
        constructor(props) {
            super(props)
            this.state = {
                checked: true
            }
            this.handleCheck = this.handleCheck.bind(this)
        }

        handleCheck() {
            this.setState({
                checked: !this.state.checked
            })
        }

        render() {
            var msg 
            if(this.state.checked) {
                msg = "checked"
            } else {
                msg = "not checked"
            }
            return (
                <div>
                    <input type="checkbox" 
                           onChange={this.handleCheck}
                           defaultChecked={this.state.checked}/>
                    <p>This box is {msg}</p>
                </div>
            )
        }
    }

Answer 1

这是JavaScript继承的工作原理。 Checkbox子类的实例原型继承自React.Component父类this.setState === super.setState。

super.method只有在子类中被覆盖时才应被引用，它通常出现在重写方法本身中：

method() {
  super.method(); // inherit the behaviour from parent class
  // do something else
}

否则super.method()的使用可被视为语义错误，它表明开发人员不了解继承机制。如果一个方法稍后会被覆盖，那么它就不会被使用（尽管在setState的情况下它不太可能）。

使用super.method()还需要开发人员了解父类实现。如this answer中所述，只有父原型方法而非实例方法可用作super。如果父类具有实例方法，

method = () => {...}

Child类将继承为this.method，但不会有super.method。

为什么我们在反应组件中使用了super.setState（）的this.setState（）

1 个答案: