从导航服务返回时，如何保持上一页的页面状态？

// 保存状态
localStorage.setItem('formState', JSON.stringify(formData));
localStorage.setItem('scrollPosition', window.scrollY);

// 恢复状态
window.addEventListener('load', () => {
  const formData = JSON.parse(localStorage.getItem('formState'));
  const scrollPosition = localStorage.getItem('scrollPosition');

  if (formData) {
    // 恢复表单数据
    document.getElementById('form').reset();
    Object.keys(formData).forEach(key => {
      document.getElementById(key).value = formData[key];
    });
  }

  if (scrollPosition) {
    window.scrollTo(0, parseInt(scrollPosition));
  }
});

import { createStore } from 'redux';
import { Provider, useSelector, useDispatch } from 'react-redux';

const initialState = {
  formData: {},
  scrollPosition: 0
};

function reducer(state = initialState, action) {
  switch (action.type) {
    case 'SAVE_FORM_DATA':
      return { ...state, formData: action.payload };
    case 'SAVE_SCROLL_POSITION':
      return { ...state, scrollPosition: action.payload };
    default:
      return state;
  }
}

const store = createStore(reducer);

function App() {
  return (
    <Provider store={store}>
      <FormComponent />
      <OtherComponent />
    </Provider>
  );
}

function FormComponent() {
  const formData = useSelector(state => state.formData);
  const dispatch = useDispatch();

  useEffect(() => {
    dispatch({ type: 'SAVE_FORM_DATA', payload: formData });
  }, [formData, dispatch]);

  return (
    <form>
      {/* 表单元素 */}
    </form>
  );
}

function OtherComponent() {
  const scrollPosition = useSelector(state => state.scrollPosition);
  const dispatch = useDispatch();

  useEffect(() => {
    window.addEventListener('scroll', () => {
      dispatch({ type: 'SAVE_SCROLL_POSITION', payload: window.scrollY });
    });
  }, [dispatch]);

  useEffect(() => {
    window.scrollTo(0, scrollPosition);
  }, [scrollPosition]);

  return (
    <div>
      {/* 其他内容 */}
    </div>
  );
}