vue.js-过滤器 filters使用详细示例

什么也不说了，直接上干货：

   1.首先，获取后台数据到页面，并调用过滤器

在<script>中添加

onRefreshItems (currentPage, perPage) {
 ?if (this.dataUrl) {
 ???this.$http.get(this.dataUrl, {params: {page: currentPage, size: perPage}}).then(res => {
 ?????let labels = []
 ?????for (var i = 0; i < res.data.length; i++) {
 ???????let item = res.data[i]
 ???????item.status = report.formatStatus(item.status)
 ???????labels.push(item)
 ?????}
 ?????this.items = labels
 ???})
 ?}
},

2.添加过滤器，在<script>中添加

filters: {
 ?formatStatus (status) {
 ???return report.formatStatus(status)
 ?}
}

3.编写js文件（report.js）

export default {
 ?formatStatus (status) {
 ???if (status === ‘TO_BE_PUT_INTO_STORAGE‘) {
 ?????status = ‘未入库‘
 ???} else if (status === ‘PARTIAL_ARRIVAL‘) {
 ?????status = ‘月台部分收货‘
 ???} else if (status === ‘WAREHOUSING_COMPLETION‘) {
 ?????status = ‘已全部入库‘
 ???} else if (status === ‘‘) {
 ?????status = ‘‘
 ???}
 ???return status
 ?}
}

4.引入

import report from ‘@/components/Table/report.js‘

如有错误欢迎留言指点，谢谢

vue.js-过滤器 filters使用详细示例

原文地址：https://www.cnblogs.com/chenshuquan/p/9301838.html