试图更新

76 阅读1分钟
export default {
    beforeCreate() {  // 不能访问data中的数据
        console.log('beforeCreate', this.msg, this.$refs.abc);
        //可以通过nextTick nextTick是dom 挂载后执行的
        this.$nextTick(() => {
            console.log('beforeCreate nextTick', this.msg);
        })
    },
    created() {  // 不能访问dom元素
        console.log('created', this.msg, this.$refs.abc);
        this.$nextTick(() => {
            console.log('created nextTick',this.$refs.abc.innerText);
        })
    },
  
    methods: {
        changeMsg() {
            this.msg = 'ikun';
            // 渲染是一个异步过程,所以此时dom树上还是旧值
            console.log(this.msg, this.$refs.abc.innerText);

          //nextTick是一个异步方法
            this.$nextTick(() => {
                console.log('nextTick', this.$refs.abc.innerText);
            })
        }
    }
}