堆栈- Pinia，Nuxt 3
我正在更新帐户中授权用户的数据。
当我通过NuxtLink时，数据从存储中加载并显示在表单中，但是当我通过f5手动重新加载页面时，数据没有显示在表单中，尽管通过dev工具它们位于form变量中

<template>
  <Form
    v-slot="{ errors }"
    :validation-schema="schema"
    class="flex flex-col"
    @submit="onSubmit">
    <div class="flex flex-col mb-3">
      <label class="text-sm font-medium mb-2">Email</label>
      <UIFormFieldEmail
        v-model="form.email"
        :error="errors.email" />
    </div>
    <div class="flex flex-col mb-5">
      <label class="text-sm font-medium mb-2">Имя</label>
      <UIFormField
        v-model="form.firstName"
        :error="errors.firstName"
        name="firstName" />
    </div>
    <div class="flex flex-col mb-5">
      <label class="text-sm font-medium mb-2">Фамилия</label>
      <UIFormField
        v-model="form.lastName"
        :error="errors.lastName"
        name="lastName"/>
    </div>
  </Form>
</template>

<script lang="ts" setup>
  import {
    Form,
    useForm,
    Field,
    defineRule
  } from 'vee-validate';
  import {
    useAuthStore
  } from '~/store/auth';
  import {
    storeToRefs
  } from 'pinia';

  const authStore = useAuthStore();
  const {
    user
  } = storeToRefs(authStore);

  const form = reactive({ ...user.value
  });
</script>