react细节

setStsate
注意的是这个方法接收两个参数，第一个是上一次的state, 第二个是props setState是异步的，所以想要获取到最新的state，没有办法获取，就有了第二个参数，这是一个可选的回调函数

this.setState((prevState, props) => { return { isLiked: !prevState.isLiked } }, () => { console.log(‘回调里的’,this.state.isLiked) }) console.log(‘setState外部的’,this.state.isLiked)

// 注意这里是两个下下划线 __html
dangerouslySetInnerHTML={{__html: this.state.content}}

事件this
//这其实与 JavaScript 函数工作原理有关。通常情况下，如果你没有在方法后面添加 ()，
//例如 onClick={this.handleClick}，你应该为这个方法绑定 this。
constructor(props) {
super(props);
this.state = {isToggleOn: true};

// 为了在回调中使用 `this`，这个绑定是必不可少的
this.handleClick = this.handleClick.bind(this);

}
render() {
return (

// 此语法确保 handleClick 内的 this 已被绑定。
// 注意: 这是 实验性 语法。
handleClick = () => {
console.log(‘this is:’, this);
}

//回调中使用箭头函数：
// 此语法确保 handleClick 内的 this 已被绑定。
return (
<button onClick={(e) => this.handleClick(e)}>

//此语法问题在于每次渲染 LoggingButton 时都会创建不同的回调函数。在大多数情况下，这没什么问题，但如果该回调函数作为 prop 传入子组件时，这些组件可能会进行额外的重新渲染。我们通常建议在构造器中绑定或使用 class fields 语法来避免这类性能问题。

<button onClick={(e) => this.deleteRow(id, e)}>Delete Row
<button onClick={this.deleteRow.bind(this, id)}>Delete Row
上述两种方式是等价的，分别通过箭头函数和 Function.prototype.bind 来实现。

在这两种情况下，React 的事件对象 e 会被作为第二个参数传递。如果通过箭头函数的方式，事件对象必须显式的进行传递，而通过 bind 的方式，事件对象以及更多的参数将会被隐式的进行传递。
React Hooks
const [count, setCount] = useState(0); return (

你点击了{count}次

<button onClick={() => setCount(count + 1)}>点击