在新建地址页，我写了如下的代码

<template>
  <div class="top">
    <div class="iconfont top__backIcon" @click="handleBackClick">&#xe602;</div>
    <div class="top__title">新建收货地址</div>
    <div class="top__btn" @click="rightBtnClick">保存</div>
  </div>
  <div class="wrapper">
    <div class="newAddress">
      <div class="newAddress__item">
        <span class="newAddress__item__text">所在城市：</span>
        <input
          class="newAddress__item__input"
          type="text" 
          v-model="city" 
          placeholder="如北京市"
        />
      </div>
      <div class="newAddress__item">
        <span class="newAddress__item__text">小区/大厦/学校：</span>
        <input
          class="newAddress__item__input"
          type="text" 
          v-model="department"
          placeholder="如理工大学国防科技园"
        />
      </div>
      <div class="newAddress__item">
        <span class="newAddress__item__text">楼号-门牌号：</span>
        <input
          class="newAddress__item__input"
          type="text"
          v-model="houseNumber"
          placeholder="A号楼B层"
        />
      </div>
      <div class="newAddress__item">
        <span class="newAddress__item__text">收货人：</span>
        <input
          class="newAddress__item__input"
          type="text"
          v-model="name"
          placeholder="请填写收货人的姓名"
        />
      </div>
      <div class="newAddress__item">
        <span class="newAddress__item__text">联系电话：</span>
        <input
          class="newAddress__item__input"
          type="text"
          v-model="phone"
          placeholder="请填写收货手机号"
        />
      </div>
    </div>
    <Toast v-if="toastData.isShowToast" :message="toastData.toastMessage" />
  </div>
</template>

<script>
import { reactive } from 'vue';
import { useRouter } from "vue-router";
import {post} from  "../../utils/request"
import Toast, { useToastEffect } from "../../components/Toast";

const pageSkipEffect = (showToast) => {
  const router = useRouter();
  const data=reactive ({    
      city:'',
      areadepartment:'',
      houseNumber:'',
      name:'',
      phone:''   
  });
  const handleBackClick = () => {
    router.back();
  };
  const rightBtnClick=async()=>{
    try{
      const result=await post('/api/user/address',{
          city:data.city,
          department:data.department,
          houseNumber:data.houseNumber,
          name:data.name,
          phone:data.phone
      })
      if(result.errno==0){
         showToast("Save success!");
      }      
    }catch(e){
      console.log(e);
      showToast("Create address fail!");
    }
  }

  return { handleBackClick,rightBtnClick};
};
export default {
  name: "CreateAddress" ,
  components:{Toast},
  setup() {
    const { toastData, showToast } = useToastEffect();
    const { handleBackClick,rightBtnClick } = pageSkipEffect(showToast);
    return { handleBackClick,rightBtnClick,toastData, showToast};
  },
};
</script>

点击保存后，程序执行没有问题（虽然不知何原因地址数据没有保存在api/user/address地址里），会弹出“保存成功”的窗口。但是，在Console窗口里却出了一堆提示：

runtime-core.esm-bundler.js?5c40:38 [Vue warn]: Property "city" was accessed during render but is not defined on instance. 

  at <CreateAddress onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< null > > 

  at <RouterView> 

  at <App>

​

五个Property都有这样的提示，我不明白是什么意思？