在我的项目中遇到一个问题,就是关上页面时,初始化数据总在更新updated 周期后才执行, 显示的不正确,须要在钩子函数中减少async/await 同步申请

代码:

//导入应用的API import { reactive, toRefs, getCurrentInstance,onBeforeMount, onMounted,onBeforeUpdate,onUpdated,onBeforeUnmount, onUnmounted, watch,computed} from "vue" export default{   components: {xx},   props: {},   setup(props, context){      console.log("*******setup******")      //获取以后实例      const {ctx, proxy} = getCurrentInstance()      // 定义响应式data 数据      const state = reactive({      })      console.log("*******end reactive******")      // 定义方法      const methods = {         async dealData(){          state.curStatus = statusFinished           await get(api).then((resData) => {                console.log("state.layoutX"+state.layoutX)                console.log("state.layoutY"+state.layoutY)           })        },        // ***********async/await 实现申请同步性能**************        async refreshData(){          await get(api).then(resData=>{              console.log("state.curStatus="+state.curStatus)          }).catch(()=>{            //state.loading = false          })          await methods.dealData()        },      }      console.log("*******end methods******")      onBeforeMount(()=>{        // dom 挂载前        console.log("*******onBeforeMount******")      })      onMounted(async()=>{        //dom 挂载后        console.log("*******onMounted******")        state.collection_id = proxy.$route.query.id        await methods.init()      })      onBeforeUpdate(()=>{        //对响应式data数据有更新, 更新前        console.log("*******onBeforeUpdate******")      })      onUpdated(()=>{        //对响应式data数据有更新, 更新后        console.log("*******onUpdated******")      })      onBeforeUnmount(()=>{        //销毁页面组件前, 即敞开        console.log("*******onBeforeUnmount******")      })      onUnmounted(()=>{        //销毁后        console.log("*******onUnmounted******")      })      return {        ...toRefs(state),        ...methods,            }  }

打印的后果如下

*******setup*************end reactive*************end methods*************onBeforeMount*************onMounted*************onBeforeUpdate*************onUpdated******state.curStatus=3state.layoutX150state.layoutY280*******onBeforeUpdate******##############################以下是子组件中打印的信息,能够不关注*******setup in MyXgPlayer******props.layoutX=150props.layoutY=280*******onBeforeMount in MyXgPlayer*************setup in MyXgPlayer******props.layoutX=150props.layoutY=280*******onBeforeMount in MyXgPlayer*************onUpdated*************onMounted in MyXgPlayer**************onMounted in MyXgPlayer*******