Javascript 拼接不使用数组行vue js

我有一个对象数组，但当我想从数组列表中删除一个对象时，只会从末尾删除项目

<div class="hours" v-for="(time, index) in hour" :key="index">

试试这个

deleteTime(index) {
       this.hour.splice(index, 1);
 },

---

我发现挑战在于您需要像前面一样在小时中添加一个唯一的id。 我已经更新了我以前的答案

 hour: [
            {
              id: 1,
              "item-1": 10,
            },
            {
              id: 2,
              "item-2": 11,
            },
            {
              id: 3,
              "item-3": 12,
            },
          ],

请注意，键被分配给从小时对象获取的唯一id

:key="time.id"

而删除项采用索引有一个参数

@click="deleteTime(index)"

---

这应该是可行的，总是添加一个跟踪id，顺便说一句，如果你在这里使用拼接它也将工作

newvue({
el:“#应用程序”，
数据：{
时间：[
{id:1，名称：“一”}，
{id:2，name:“two”}，
{id:3，名字：“三”}
]
},
方法：{
删除时间（id）{
this.hour=this.hour.filter（item=>item.id！=id）；
}
},
});

{{time.name}}
德尔
为什么不直接使用
这个.hour.splice（索引，1）已尝试，但不起作用…尝试时出现了什么错误
this.hour.indexOf（index）
将返回未定义。另外，为什么要将
：键
绑定到
时间.索引
，而不是简单地绑定到
索引
？另一方面，对键属性使用索引（可能因排序而改变）不是一个好主意。使用对象的一个属性，最好是一个唯一的IDi，左为：仅键索引，正如您告诉我的，我不能使用另一个属性，因为它在
数据中没有任何值
hour
。您是否尝试过在
deleteItem（）
中同时记录
hour
和
index
？他们是你所期望的吗？您可以将
hour
和
index
的记录值添加到问题中吗？控制台中没有任何错误，但它总是删除最后一行。index的值是多少？索引会根据他们想要删除的行进行更改。您可以创建一个代码沙盒并共享链接吗
:key="time.id"

@click="deleteTime(index)"

      <div class="hours" v-for="(time, index) in hour" :key="time.id">
        <button @click="deleteTime(index)">
          Content {{time.id}}
        </button>
      </div>

deleteTime(index) {
            this.hour.splice(index, 1);
          },