vue中data pros computed的执行前后顺序

Vue.js中,实例化组件时,以下是ata、propscomputed的执行顺序:

首先,Vue会初始化组件的props,将父组件传递的属性值设置到子组件的props中。

接下来,Vue会执行data函数(或对象),并将返回的数据对象与组件实例进行关联。这时,组件实例会拥有data中定义的属性,并且这些属性是响应式的。(此处可以访问this.$store,但是用辅助函数mapGetters的解构的计算属性,无法访问,因为computeddata之后初始化)

然后,Vue会执行计算属性computed。在这个阶段,计算属性会根据其定义的依赖关系进行计算,并将计算结果与组件实例关联。

总结起来,执行顺序是:props -> data -> computed

需要注意的是,在执行computed阶段时,它依赖的propsdata已经初始化完毕,因此可以在计算属性中使用它们的值。另外,计算属性的值是基于内部依赖的变化而自动更新的,当依赖的propsdata发生变化时,计算属性自定更新

猜你喜欢

转载自blog.csdn.net/qq_44741577/article/details/140892918