在 Vue.js 项目中，如何保留路由跳转前页面的数据？

// 旧页面代码
<template>
  <button @click="toNewPage">跳转到新页面</button>
</template>

<script>
import { useRouter } from 'vue-router';
import store from '../store';

export default {
  setup() {
    const router = useRouter();
    const toNewPage = () => {
      router.push({
        path: '/new-page',
        query: { data: store.state.formData },
      });
    };

    return { toNewPage };
  },
};
</script>

// 新页面代码
<template>
  <select>
    <option v-for="option in options" :value="option.value">{{ option.label }}</option>
  </select>
</template>

<script>
import { useRouter, useRoute } from 'vue-router';
import store from '../store';

export default {
  setup() {
    const router = useRouter();
    const route = useRoute();

    const options = [
      { value: 'A', label: 'Option A' },
      { value: 'B', label: 'Option B' },
    ];

    const submit = () => {
      const formData = { value: route.query.data };
      store.commit('setFormData', formData);
      router.go(-1);
    };

    return { options, submit };
  },
};
</script>