vue中的API的理解

264 阅读1分钟

第一次写博客写得不好,还请各位多多见谅! 有错误还请大佬帮忙更正一下 对于$nextClick可能有的人比较陌生,并不知道具体干嘛的,我自己将其尝试的去使用了一下,其实很简单

有的时候数据改变了,我们想要立即获得实例的内容,然后去做其他的操作,发现根本获取不了内容,这个时候我们就需要使用到$nextClick这个属性了,直接上代码吧:

<template>
   <button ref="button" @click="click>{{a}}<button>
<template>
<script>
  data() {
      return{
          a: 1
      }
  },
  methods:{
    click() {
        this.a = 2
        console.log(this.$ref.textContent) // 1
        this.$nextClick(()=>(
          console.log(this.$ref.textContent) //2
        
        )}
    } 
  }


<script/>

以上代码说明了,在点击之后数据虽然变化了,但是dom实例并没有渲染上去,$nextClick的意思是dom完全渲染完毕,才去执行这个函数,有兴趣的小伙伴可以自己去试一下哦,明天见,每天出一个api的笔记,觉得可以的点个赞哦