如何使用Vue和Vuetify将数据路由到新页面以填充表单？

// 假设你有两个组件：Form.vue 和 NewPage.vue

// Form.vue
<template>
  <v-form>
    <v-text-field v-model="name" label="姓名"></v-text-field>
    <v-text-field v-model="email" label="邮箱"></v-text-field>
    <v-btn @click="submitForm">提交</v-btn>
  </v-form>
</template>

<script>
export default {
  data() {
    return {
      name: '',
      email: ''
    };
  },
  methods: {
    submitForm() {
      // 使用 Vue Router 的 router.push 方法进行页面跳转，并传递表单数据
      this.$router.push({
        path: '/new-page',
        query: {
          name: this.name,
          email: this.email
        }
      });
    }
  }
};
</script>

// NewPage.vue
<template>
  <v-form>
    <v-text-field v-model="name" label="姓名"></v-text-field>
    <v-text-field v-model="email" label="邮箱"></v-text-field>
  </v-form>
</template>

<script>
export default {
  data() {
    return {
      name: '',
      email: ''
    };
  },
  created() {
    // 通过 $route.query 获取传递过来的表单数据
    this.name = this.$route.query.name || '';
    this.email = this.$route.query.email || '';
  }
};
</script>