Javascript 从vue js阵列获得最低价格

我有一个数组，它循环遍历所有行程以获得一个列表

 <span v-for="price in listing.trips">
       <div class="price">{{ price.cost }} </div>
</span>

{{price.cost}

是否可以应用过滤器，只是为了价格最低的旅行

我试过：

 <span v-for="price in listing.trips">
                        <div class="price">{{ Math.min(price.cost) }} </div>
                    </span>

{{Math.min（price.cost）}

也许您可以创建计算属性

new Vue({
    ....
    computed: {
        cheapestTrip: function () {
            return this.listing.trips.sort(trip=>trip.price)[0];
        }
    }
});

然后像这样使用它：

<span>
   <div class="price">{{ cheapestTrip }} </div>
</span>

{{最便宜的旅行}

如果希望使用数组，也可以省略

[0]

。在这种情况下，请使用视图片段