记录是为了更好的成长！

 

1、Vue.$nextTick()

网上搜一下资料很多，这里只做最通俗的说明：

Vue.$nextTick() 会在页面的DOM发生了变化之后自动执行，如果要获取最新的变化就需要用Vue.$nextTick()回调来做，也可以做其他的逻辑操作

<template>
    <div class="hello">
        <div class="hello">
            <div>
                <button @click="myclick()" ref="aa">{{msg}}</button>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: 'HelloWorld',
        data() {
            return {
                msg: '原始值'
            }
        },
        methods: {
            myclick: function() {
                let that = this;
                that.msg = "修改后的值";
                //console.log(that.$refs.aa.innerText); //that.$refs.aa获取指定DOM，输出：原始值
                that.$nextTick(function(){
                    console.log("dom更新了")
                        console.log("$nextTick:"+that.$refs.aa.innerText);  //输出：修改后的值
                });
                }
        }
    }
</script>

<style scoped>

</style>

 

 

 

以上内容代表个人观点，仅供参考，不喜勿喷。。。