可以使用深度比较或使用浅拷贝来更新状态,以便触发重新渲染组件。以下是使用深度比较的示例代码:
import { isEqual } from 'lodash';
class MyComponent extends React.Component {
componentDidUpdate(prevProps, prevState) {
if (!isEqual(this.props.myState, prevProps.myState)) {
// handle state change
}
}
render() {
return My Component;
}
}
或者,您可以使用浅拷贝来更新状态,以便确保每次状态更改时都会在状态对象上进行更改。以下是示例代码:
class MyComponent extends React.Component {
componentDidUpdate(prevProps, prevState) {
if (this.props.myState !== prevProps.myState) {
// handle state change
}
}
handleButtonClick = () => {
const newState = { ...this.props.myState };
newState.someValue = 'new value';
this.setState({ myState: newState });
}
render() {
return (
{this.props.myState.someValue}
);
}
}
下一篇:不能处理 sails.js 会话