Javascript 如何在混合Vue项目中添加/删除阵列中的行？

所以，我构建了这个小webapp来帮助我优先考虑我想要构建的想法

我现在正在尝试从接口向数组中添加项。它也将是很好的，能够删除项目

这段代码有点混合了使用Vue的方法

只需看看名称的设置和显示方式

<td>{{ product.name }}</td>
<td><input id="iname"/></td>

我知道我应该在

new Vue({})

但这样做会使总计列失败

有人能帮忙吗！我确信我遗漏了一些简单的东西

编辑：由于@Sphinx，代码笔已更新并工作 请参见HTML中的

@click=“addItemByVue（）；”

，以及JS中的

addItemByVue

，试试：

created: {
  window.addItem = this.addItemByVue.bind(this)
}

---

我不建议使用混合方法，在Vue中设置时失败的原因是什么？正如@phix所说，混合方法不是一个好主意。对于您的用例，JQuery将优于Vue。无论如何，您可以为“添加”按钮绑定单击事件，然后将新对象添加到此.sort。比如@Phix-我知道，但我觉得这么简单的项目会更容易…@Sphinx-谢谢！我的代码笔已根据您的添加进行更新和工作。

created: {
  window.addItem = this.addItemByVue.bind(this)
}