在Ionic React中页面更改后，如何在不重置的情况下更改上下文的值？

import React from 'react';

const MyContext = React.createContext();

export default MyContext;

import React from 'react';
import MyContext from './MyContext';

const ParentComponent = () => {
  const [value, setValue] = React.useState('initial value');

  return (
    <MyContext.Provider value={{ value, setValue }}>
      <ChildComponent />
    </MyContext.Provider>
  );
};

export default ParentComponent;

import React from 'react';
import MyContext from './MyContext';

const ChildComponent = () => {
  return (
    <MyContext.Consumer>
      {({ value, setValue }) => (
        <div>
          <p>Current value: {value}</p>
          <button onClick={() => setValue('new value')}>
            Change value
          </button>
        </div>
      )}
    </MyContext.Consumer>
  );
};

export default ChildComponent;