vue.js:从观察者更新数据

Question

我有以下代码:

export default {
    name: '...',
    props: ['user'],
    data() {
        return {
            userName: this.user.name
        }
    },
    watch: {
        user: (_user) => {
            this.userName = _user.name
        }
    },
    methods: {
        ...
    }
};

userprop由父组件更新(它来自服务器的信息).如果我记录_user变量,我有一切可用.该userName道具不更新,虽然.

Answer 1

由于您使用胖箭头功能如下:

user: (_user) => {
            this.userName = _user.name
        } 

在这个没有指向VUE实例,因此通过使用this.userName你是不是指的该userName数据中的属性.

所以使用这样的普通函数:

user: function(_user){
            this.userName = _user.name
        } 

在vuejs文档中提到了关于使用箭头函数定义观察者的警告.你可以看看这里