vue -> 过滤器

全局过滤器

  //时间过滤(全局的)
  vue.filter(“过滤器名字”,执行函数(接受参数))
  Vue.filter("timefilter", (timestr,[...parse])=>{
    const dt = new Date(timestr)
    const y = dt.getFullYear()
    const m = dt.getMonth() + 1
    const d = dt.getDate()
    return `${y}-${m}-${d}`
  })
  调用:
  <div>
	{{ new Date() | timefilter | ...| ...}}  //可以传入多个过滤器,串联使用
</div>

局部过滤器

  调用:
  <div>
	{{ new Date() | capticalSize | ...| ...}}  //可以传入多个过滤器,串联使用
</div>

const vm = new Vue({
      el: '#app',
      data: {
        item:{
          price: 10
        }
      },
      filters: {
        capticalSize:(v,[...parse])=>{
          return v[0].toUpperCase()+v.substr(1)//功能:传入字符串使第一个字母大写 并返回这个字符串
        }
      }
    })
11:01:58.186 [Vue warn]: Duplicate keys detected: '5'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '5'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '5'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '5'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '6'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '6'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '6'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '6'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '7'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '7'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '7'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '7'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '10'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '10'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '10'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '10'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '11'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '11'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '11'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '11'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '12'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '12'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '12'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '12'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '14'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.186 [Vue warn]: Duplicate keys detected: '14'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.187 [Vue warn]: Duplicate keys detected: '14'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.187 [Vue warn]: Duplicate keys detected: '14'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.187 [Vue warn]: Duplicate keys detected: '15'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.187 [Vue warn]: Duplicate keys detected: '15'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.187 [Vue warn]: Duplicate keys detected: '15'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.187 [Vue warn]: Duplicate keys detected: '15'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.187 [Vue warn]: Duplicate keys detected: '16'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.187 [Vue warn]: Duplicate keys detected: '16'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.187 [Vue warn]: Duplicate keys detected: '16'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.187 [Vue warn]: Duplicate keys detected: '16'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.188 [Vue warn]: Duplicate keys detected: '17'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.188 [Vue warn]: Duplicate keys detected: '17'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.188 [Vue warn]: Duplicate keys detected: '17'. This may cause an update error.\n\nfound in\n\n---> <Root> 11:01:58.188 [Vue warn]: Duplicate keys detected: '17'. This may cause an update error.\n\nfound in\n\n---> <Root>
07-17
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值