我有这个 React Class component
我不能让Button文本从 on
到 off
import React from 'react';
import ReactDOM from 'react-dom';
class Toggle extends React.Component {
constructor(props) {
super(props);
this.state = {
on: true
}
}
handleClick = () => {
// todo
this.setState((prevState) => {
on: !prevState.on
})
}
render() {
const {
on
} = this.state;
return ( <
button onClick = {this.handleClick} >
{
on ? "On" : "Off"
} < /button>
);
}
}
ReactDOM.render( <
Toggle / > ,
document.getElementById('root')
);
我以为每次点击按钮,它都会看到之前的状态,并且会更新。
你只是少了一些括号。如果你想隐式返回一个对象,你必须把它们放进去。
handleClick = () => {
this.setState(prevState => ({
on: !prevState.on
}));
};
检查结果 此处