Javascript 使用v-for时的顺序

当使用v-for在数组上迭代时，如下所示：

<ul id="example-1">
  <li v-for="item in items">
     {{ item.message }}
  </li>
</ul>

{{item.message}}

这些元素排列在彼此下面：

• 索引为1的列表项
• 索引为2的列表项
• 带索引的列表项
• 索引为n的列表项

是否有方法将当前迭代中的项目添加到最后一个项目之上

• 索引为n的列表项
• 带索引的列表项
• 索引为2的列表项
• 索引为1的列表项

---

多谢各位

您可以使用第二个数组来“存储”反向数据，并使用（而不是

推送

）将每个新元素放在“反向”数组的开头：

newvue({
el:“应用程序”，
数据（）{
返回{
项目：[“项目1”、“项目2”、“项目3”]，
ReverseItems:[]
} 
},
安装的（）{
this.reverseItems=this.items.reverse（）
},
方法：{
loadItem（）{
设i=this.items.length
此.items.unshift（“item”+（i+1））
}
}
})

{{item}

加载项

一个简单的解决方案是使用

项的一个数组来反转数组（如果数组用作
道具，或者为了保持其最初声明的顺序，则不会对其进行适当的修改）：
reverseItems（）{return this.items.slice（）.reverse（）；}

代码示例：


newvue({
el:“应用程序”，
数据（）{
返回{
项目：[“项目1”、“项目2”、“项目3”]，
}
},
计算：{
reversedItems（）{
//反转数组的副本以避免扰乱其初始顺序。
返回此.items.slice（）.reverse（）；
},
},
方法：{
loadItem（）{
常数i=this.items.length；
//以一种简单的方法追加到数组的末尾，
//并让计算属性对数组重新排序。
这个.items.push（“item”+（i+1））；
},
},
});


{{item}

加载项
如果您想更改数组的顺序，则只需使用数组[1,2,3]的.reverse（）方法即可。reverse（）=>[3,2,1]谢谢您的回答。我已经考虑过了。问题在于，在运行时，数组会发生变化。所以这不是一个选择。我也试着取消移动而不是推。但是，元素仍然呈现在项目下面。加载项目时对其进行排序。ajaxcall（）.then（（res）=>this.items=res.data.sort（“…”））除了……当您执行
items.unshift（“item4”）
时，
items
数组应成为
[“item4”、“item1”、“item2”、“item3”]
，因此显示应从上到下：item3、item2、item1、item4，而您的代码是：item4、item3、item2、item1。