在 VueJs 中，你可以将请求中的数据绑定到数据

因此，在下面的示例中，我将评论如何执行此操作：

<template>
   <div>
      <span>{{ user.username }}</span>
      <button @click="getUser(// The user Id)">Click me to get User</button>
   </div>
</template>

<script>
export default {
   data(){
      user:{
         username: "",
      },
   },
   methods:{
      async getUser(userId){
            const res = await this.getUser(userId);
            // Set response on the user registered in data
            this.user.username = res.data.name;
            // Now that you have set the username on the user object
            // You can approach it with {{user.username}}
      }
   }
};
</script>

处理此问题最简单的方法之一是在 Vue 中创建一个数据变量，并让 Vue 在承诺完成时重新渲染该变量。

<div>
   {{ username }}
</div>

data(){
  return {
    username: ''
  }
}

methods: {
 async getUser(userId) {
     try {
        const res = await this.getUser(userId);
        this.username = res.data.name;
     } 
     catch (error) {
        this.username = 'Oh oh , something went wrong' // optional
     }
  },
}