Vue-nextTick

# nextTick是什么？

获取更新后的DOM

<template>
	<div>
        <button @click='btn' ref='box'>
            {{str}}
        </button>
    </div>
</template>

1
2
3
4
5
6
7

<script>
export default{
	name:'Home',
	data(){
        return{
            str:'123'
        }
    },
    methods:{
        btn(){
            this.str = 'bbb'
            
            console.log(this.$refs.box.innerHTML)//123
            
            this.$nextTick(()=>{
                console.log(this.$refs.box.innerHTML,'nextTick')//bbb nextTick
            })
        }
    }
}    
</script>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

上次更新: 2024/08/14, 04:14:33

← Vue-ref是什么？ MVVM→