Subscribe on changes!

v-for内 循环组件 组件加载顺序与数组顺序相反

avatar
Sep 10th 2021

Version

3.2.11

Reproduction link

github.com

Steps to reproduce

<div v-for="i in arr" :key="i" > --> <HelloWorld :msg="i + '======== === = '" /> </div>
在HelloWorld 内 created中输出msg

将arr改为[1,2,3,4,5] 控制台输出 5 4 3 2 1 与数组顺序相反

我又试了vue2 顺序是相同的

What is expected?

for 内的组件顺序渲染

What is actually happening?

倒序渲染


vue3的特性就是这样 还是个bug?

avatar
Sep 10th 2021

语言表述的而不太清楚 可以项目拉下来看下

avatar
Sep 10th 2021

This is not a bug SFC

Also, please don't provide a full project to report an issue. There was no need for routing, vuex, nor TS. The SFC playground is better in those scenarios. And open issues in English. Remember to use the forum or the Discord chat to ask questions!

avatar
Sep 10th 2021

Look at this 看看这个 I modified it

SFC

image

Is this in normal order? 这个是顺序正常的吗?

avatar
Sep 10th 2021

There is no guarantee in the order components get unmounted/mounted/updated as there are different optimizations that can happen so you should definitely not rely on it.

avatar
Sep 10th 2021

thank you