Question

我正在使用vue＆laravel.i创建一个编辑配置文件页面，其中包含一些表单（名称，电子邮件，...）此表单的默认值不是首次显示，但是如果用户刷新页面，一切都会正常！！！

<template>
 <label>Name:</label>
 <input type="text" v-model="name">
 <label>Email:</label>
 <input type="email" v-model="email">
<template>

<script>
export default {
    data () {
        return {
            name:'',
            email:'',
        }
    },
    mounted : function(){
        this.getVueItems();
    },
     methods: {
        getVueItems: function(){
            axios.get('./api/auth/me').then(response => {
                var vm = this;
                vm.name = response.data.name;
                vm.email = response.data.email;
            });
        },

        getAuthUser () {
            this.user = this.$store.getters.currentUser
        },

        updateAuthUser () {
            this.submiting = true,
            axios.put('./api/auth/update', {
                name:this.name,
                email:this.email,
            })
            .then(response => {
                // this.submiting = false;
                location.reload(true);
                // success();
            })
            .catch(error => {
                this.submiting = false;
            })
        },
    }
}
</script>

出什么问题了？

Answer 1

使用箭头功能时，该关键字已经可以在函数内部访问。为此，您应该首先在控制台中检查是否从控制台中的api获得正确的响应值。因此，如下更改功能并检查一次。

 async getVueItems() {
  await axios.get('./api/auth/me').then(response => {
      console.log(response);
      this.name = response.data.name;
      this.email = response.data.email;
  });

硬刷新后显示数据

1 个答案: