反应js和arrow函数与普通函数的比较[重复]

Question

我在做一个反应。js应用程序和我最初使用了箭头函数，但出于好奇，我决定尝试正常函数，但正常函数不起作用。我认为他们都应该输出相同的东西，出了什么问题？

handleChange = event => this.setState({init: event.target.value})

handleChange(event){
  this.setState({init: event.target.value})
}

Answer 1

箭头函数和普通函数不等同。

区别如下：

>

箭头函数没有自己的此绑定，因此您的此。设置状态请参阅YourClass。设置状态。

使用普通函数，您需要将其绑定到类以获得类的此引用。所以当你调用这个。设置状态实际上指的是您的功能。setState（）。

样本代码

class FancyComponent extends Component {
    handleChange(event) {
        this.setState({ event }) // `this` is instance of handleChange
    }

    handleChange = (event) => {
        this.setState({ event }) // `this` is instance of FancyComponent
    }
}