filters在vue项目中的使用

而耳迩儿

于 2022-11-26 22:27:49 发布

阅读量414

点赞数

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/m0_65274248/article/details/128058396

版权

当对接口数据不再是简单的处理时，全部写在template中并不是最优解。这时候需要使用filters方法对数据进行处理。再在页面中使用。

<el-table-column label="失联时间" align="center" prop="lostTime" width="180" sortable>
        <template slot-scope="scope">
          已有<span style="color: red;">{{ scope.row.followTime | lostTime }}</span>天未联系该客户
        </template>
      </el-table-column>


    filters: {
      //将接口获取的时间戳进行处理，并转换成天数应用于页面
      lostTime: function (number) {
        const diff = new Date().getTime() - number
        return Math.floor(diff / (24 * 3600 * 1000));
      }
    },