vue updated方法的触发条件是当data中定义的数据有变化时就会加载updated方法

        由于数据更改导致的虚拟 DOM 重新渲染和打补丁，在这之后会调用updated钩子函数。

        无论是组件本身的数据变更，还是从父组件接收到的 props 或者从vuex里面拿到的数据有变更，都会触发虚拟 DOM 重新渲染和打补丁，并在之后调用 updated。有个值得注意的地方，举例说明：

例子

<template>
    <div>
        <div v-for="(item, index) in list" :key="index">{{item}}</div>
    </div>
</template>
 
<script>
export default {
    data () {
        return {
            list: [1, 1, 1]
        }
    },
    created () {
        setTimeout(_ => {
            this.list = [2, 2, 2]
        }, 1000)
    },
    updated () {
        console.log('App.vue finish re-render')
    }
}
</script>

我们再来熟悉一下mounted、beforeUpdate、updated三者的概念

• mounted 直译就是挂载完毕，它表示的应当是已经渲染完毕了，具体的页面已经呈现出来了，内存中的模版成功挂载到页面

• beforeUpdate 直译就是更新前，它表示的应当是页面有某处即将更新时触发，但此时，页面并没有更新，由数据更新得知即将更新的信息，页面没有和data中的数据保持一致

• updated 直译就是更新后，它表示的应当是页面与data中数据保持一致的状态，数据更新，页面也更新结束的状态

Vue中updated和watch的区别？

        watch:

        1.仅仅是数据发生改变的时候会侦听到

        2.只是会检测到你写在watch里的那些属性,没写的就不会触发

        updated:

        1.执行到它的时候时候是数据发生变化且界面更新完毕

        2.所有的数据发生变化都会调用

        3.每次触发的代码都是同一个

        通过以上内容我们知道了vue updated触发条件是什么？感谢您访问“我爱捣鼓(www.woaidaogu.com)”网站的内容，希望对大家有所帮助！引用本文内容时，请注明出处！谢谢合作！