Javascript 在VueJS中输出动态值？

我试图根据添加值的次数呈现动态标题。在下面的示例中，如果用户选择

cats

并单击

Add

我想呈现标题

cats 1

，并且如果用户再次添加，则应添加

cats 2

标题，依此类推，这同样适用于

dogs

。我一直想弄清楚这件事

这是工作表

以下是工作代码：-

newvue({
el:“应用程序”，
数据（）{
返回{
选定：[]，
动物学家：[]，
更多动物：[{
标题：“猫”，
价值：“猫”
},
{
标题：“狗”，
价值：“狗”
}
]
};
},
方法：{
createTitle（）{
this.animalList=this.animalList.concat（this.selected）；
console.log（this.animalList）；
this.selected=[]；
}
}
});

{{animal.value}}
添加
您可以通过获取最新添加的该类型动物，解析其值末尾的数字，并递增以将其附加到要添加的动物的值中来实现：


newvue({
el:“应用程序”，
数据（）{
返回{
选定：[]，
动物学家：[]，
更多动物：[
{
标题：“猫”，
价值：“猫”
},
{
标题：“狗”，
价值：“狗”
},
{
标题：“骆驼”，
价值：“骆驼”
},
]
};
},
方法：{
createTitle（）{
for（设i=0；i

{{animal.value}}
添加
你真是个天才。非常感谢你！！我有一个简单的问题，如果我添加另一个对象，比如说标题为：'camel'
，我不想让这个逻辑为它运行，那该怎么办？不客气。如果您不想更改标题为“camel”的动物的值，您只需在更改值之前添加
if station
。我更新了上面的代码作为演示。再次非常感谢！！