如何在不更改组件状态的情况下更改组件状态的副本？

const originalState = { count: 0, text: 'Hello' };
const copyState = Object.assign({}, originalState);
// 或者使用展开运算符
// const copyState = { ...originalState };

copyState.count = 1;
console.log(originalState.count);  // 输出 0，未更改
console.log(copyState.count);     // 输出 1，更改了副本的值

import cloneDeep from 'lodash/cloneDeep';

const originalState = { count: 0, nestedObj: { text: 'Hello' } };
const copyState = cloneDeep(originalState);

copyState.nestedObj.text = 'World';
console.log(originalState.nestedObj.text);  // 输出 'Hello'，未更改
console.log(copyState.nestedObj.text);     // 输出 'World'，更改了副本的值

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = { count: 0 };
  }

  handleClick = () => {
    this.setState(prevState => ({
      count: prevState.count + 1
    }));
  }

  render() {
    return (
      <div>
        <p>Count: {this.state.count}</p>
        <button onClick={this.handleClick}>Increase Count</button>
      </div>
    );
  }
}