- N +

Vue.nextTick( [callback, context] )

原标题:Vue.nextTick( [callback, context] )

导读:

vue数据驱动修改视图, vue 内部做修改数据时,并不会立即更新到视图上,期间需要对数据再次做修改时,就可以使用nextTick方法来实现实例如下:<template&...

文章目录 [+]

vue数据驱动修改视图, vue 内部做修改数据时,并不会立即更新到视图上,期间需要对数据再次做修改时,就可以使用nextTick方法来实现

实例如下:

<template>
    <div class="home">
        <div ref='mvg'>{{names}}</div>
        <button @click="chaged">btn</button>
    </div>
</template>
<script>
// @ is an alias to /src

export default {
name: 'home',
data () {
    return {
        names: '名字'
    }
},
methods: {
    chaged () {
        this.names = '修改'
        this.$nextTick(() => {
            console.log(this.$refs.mvg.innerHTML)
        })
        console.log(this.$refs.mvg.innerHTML)
    }
  }
}
</script>

效果图:

image.png

有好的文章希望我们帮助分享和推广,猛戳这里我要投稿

0

0
返回列表
上一篇:
下一篇:

发表评论中国互联网举报中心

快捷回复:

验证码

    评论列表 (暂无评论,共125人参与)参与讨论

    还没有评论,来说两句吧...