Vue中对过滤器的简化

需求:在页面某个地方,需要将后台传过来的数值型数据转换为对应字符串显示到页面上(以管道符的过滤器为例)

{{experienceUnit | experienceUnitFilter}}

优化前:用常规的if...else...或者switch语句

experienceUnitFilter (date) {
  let dateTime = date
  switch (parseInt(dateTime)) {
    case 1:
      dateTime = '天'
      break
    case 2:
      dateTime = '个月'
      break
    case 3:
      dateTime = '年'
      break
    case 4:
      dateTime = '*季'
      break
    case 5:
      dateTime = '*半年'
      break
    default:
      dateTime = '天'
  }
  return dateTime
}

优化后:新建一个临时对象

experienceUnitFilter (date) {
  let dateTime = {
    1: '天',
    2: '个月',
    3: '年',
    4: '*季',
    5: '*半年'
  }
  return dateTime[date]
}

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值