1.使用:class给元素添加动态值

<span class="pdl-10" :class="addClass(value)">
    {{value<0?-(value):value}}
</span>

methods: {
    addClass(diffValue){
      if(diffValue>0){
        return "arrow_up";
      }else if(diffValue<0){
        return "arrow_down";
      }else {
        return "";
      }
    },
}

2.使用v-if展示不同class

<span class="pdl-10 arrow_up" v-if="value>0">
  {{value}}
</span>
<span class="pdl-10 " v-if="value==0">
  {{value}}
</span>
<span class="pdl-10 arrow_down" v-if="value<0">
  {{-(value)}}
</span>

3.使用三目运算符

<span class="pdl-10" :class="value>0?'arrow_up':(value===0?'':'arrow_down')">
 {{value<0?-(value):value}}
</span>