Question

在我的Vue应用程序中，我从API中获得了一些JSON，然后我计算返回的数据并通过其属性之一对其进行排序，然后我希望在客户端每次更新属性时重新使用它，我认为将`v-model =“ tag.weight”添加到输入中就足够了，但是显然不是吗？我在做什么错？

<div class="mt-6" v-if="this.sortedTags">
        <div class="w-full flex justify-between pb-2 border-white">
            <div class="w-1/3 p-4 font-black">Tag</div>
            <div class="p-4 font-black">Active</div>
            <div class="p-4 font-black">Weight</div>
        </div>
        <div class="w-full flex justify-between" v-for="tag in this.sortedTags" :key="tag.id">
            <div class="w-1/3 p-4">{{ tag.tag }}</div>
            <div class="p-4"><input type="checkbox" /></div>
            <div class="p-4"><input type="text" v-model="tag.weight" size="3" class="text-black"/></div>
        </div>
    </div>


computed: {
    ...mapState(['admin']),
    sortedTags() {
        return this.admin.tags.sort(function(a, b) {
            a.weight - b.weight;
        });
    }
}

我希望的是1）如果在绑定tag.weight的权重字段中输入数字，它将根据该输入对它进行排序，以及2）当我向数据中添加新对象时，它会会选择的。

Answer 1

省略return时，我得到类似的结果，它将给您答复，但是重新排序将不起作用。因此，只需使用return a.weight - b.weight;而不是简单的a.weight - b.weight;

详细说明：https://stackoverflow.com/a/38159151/3256489

排序计算值并更新计算值vue

1 个答案: