vue渲染数据的一点问题

Question

div v-for="(item,i) in dataList" :key="i" class="wrapper">     <div class="top-title" :id="item.id">         <div class="name">{{item.product}}</div>         <div class="num">{{item.status}}</div>       </div>       </div>item.status是从后台拿到的状态码，例如status是10，我要相应地变成文字‘成功’，返回是20，我要相应变成文字‘失败’，用JQ的话可以渲染一个一个判断，但是这种页面渲染的话应该怎么实现？有想过用ref获取渲染出来的状态码，然后通过方法判断，但实现起来还是有问题，麻烦各位大佬赐教

Answer 1

1. 通过方法

methods: {    filter(key) {        return status[key]
    }
}//这样子调用<div class="num">{{filter(item.status)}}</div>

1. 或者在获取数据之后就遍历一遍重新赋值一个新字段表示状态

2. 在data里面放置一个status

//这样子调用<div class="num">{{status[item.status]}}</div>

Answer 2

用过滤器，判断状态码返回相应内容，或者计算属性