在ReactJS中存储以前的值的位置

import React, { useState } from 'react';

function MyComponent() {
  const [previousValue, setPreviousValue] = useState(null);

  // 存储以前的值
  const storePreviousValue = (value) => {
    setPreviousValue(value);
  };

  return (
    <div>
      <p>以前的值：{previousValue}</p>
      <button onClick={() => storePreviousValue('旧值')}>存储值</button>
    </div>
  );
}

import React, { createContext, useContext, useState } from 'react';

const PreviousValueContext = createContext(null);

function MyComponent() {
  const [previousValue, setPreviousValue] = useState(null);

  // 存储以前的值
  const storePreviousValue = (value) => {
    setPreviousValue(value);
  };

  return (
    <PreviousValueContext.Provider value={previousValue}>
      <div>
        <p>以前的值：{previousValue}</p>
        <button onClick={() => storePreviousValue('旧值')}>存储值</button>
        <ChildComponent />
      </div>
    </PreviousValueContext.Provider>
  );
}

function ChildComponent() {
  const previousValue = useContext(PreviousValueContext);

  return (
    <p>从上下文中获取的以前的值：{previousValue}</p>
  );
}