在 v-for 循环中比较不同对象中的值

【问题标题】：Compare values in separate objects within a v-for loop在 v-for 循环中比较不同对象中的值
【发布时间】：2020-02-12 09:31:35
【问题描述】：

我在 v-for 循环中访问了嵌套对象。

我想通过v-bind:style 更改颜色，方法是将当前对象的tradePrice 值与之前对象中的tradePrice 值进行比较。

<td v-bind:style="{ color: summary.tradePrice > 0 ? 'red' : 'blue' }">{{ summary.tradePrice }}</td>

我需要summary.tradePrice[1] > summary.tradePrice[0] 之类的东西，但显然这是在 v-for 内部，所以我无法通过这种方式访问对象的位置。

这是最终结果应该产生的结果：

【问题讨论】：

【解决方案1】：

您可以像下面这样定义您的v-for 并使用index

<div v-for="(val,index) in summary.tradePrices" :bind="index"></div>

【讨论】：

如何访问预览对象的值进行比较？
index-1 应该给你以前的对象值。
或更准确地说是summary.tradePrices[index-1]。
我试过这个：<tr v-for="(transaction, index) in summary.tradePrices" :bind="index"><span v-bind:style="{ color: transaction.tradePrice > transaction.tradePrice[index-1] ? 'red' : 'blue' }"> 但是无论值的变化是大于还是小于，它总是使它成为blue
应该是<tr v-for="(transaction, index) in summary.tradePrices" :bind="index"> <span v-bind:style="{ color: transaction.tradePrice > summary.tradePrices[index-1].tradePrice ? 'red' : 'blue' }"> </tr>