vue中，如何根据一个number值的大小来给定颜色。

// template
<div v-for="item in list" :style="'color:'+(item.value>0?'red':'green')+';'">{{item.name}}</div>

// js
data () {
    return {
        list: [{
            name: 1,
            value: 1
        }, {
            name: 2,
            value: -1
        }, {
            name: 3,
            value: 3
        }]
    }
}

Update:
点击的时候更改背景颜色

// template
<div v-for="(item, index) in list" <!-- vue1.0 item和index换下位置 -->
      @click="clickHandler(index)"
      :class="{active: index === activeIndex}"
      :style="'color:'+(item.value>0?'red':'green')+';'">{{item.name}}</div>

// js
data () {
    return {
        list: [{
            name: 1,
            value: 1
        }, {
            name: 2,
            value: -1
        }, {
            name: 3,
            value: 3
        }],
        activeIndex: -1
    }
},

methods: {
    clickHandler (index) {
        this.activeIndex = index
    }
}

// css
.active {
  background-color: yellow;
}

把样式弄成动态的就行

换class名吧
:class='[item.value>0?"green":"red"]'

官方文档：https://cn.vuejs.org/v2/guide...