请选择 进入手机版 | 继续访问电脑版

极客蜗牛

查看: 382|回复: 0

vue.js 自定义过滤器

[复制链接]

82

主题

99

帖子

657

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
657
QQ
发表于 2018-1-2 18:52:14 | 显示全部楼层 |阅读模式
方法一
  1. Vue.filter('shop_lv', function(lv) {

  2.                                 return "../../img/icon/lv" + lv + ".png"
  3.                         });
复制代码
方法二
  1. var vm = new Vue({
  2.     el: '.mui-content',
  3.     data: {
  4.         taskitem: {},
  5.         weatherDict: []
  6.     },
  7.     mounted: function(){
  8.         this.$nextTick(function() {
  9.             ……
  10.         });
  11.     },
  12.     filters:{
  13.         FormatDate:function(date,type){
  14.             console.log(date+","+type);
  15.             return dateFns.format(date,type);
  16.         }
  17.     },
  18.     methods: {
  19.         ……
  20.     }

  21. })
复制代码
使用:
    单参数:
  1. item.lv | shop_lv
复制代码
  1. {{item.phone | 过滤器名称}}
复制代码
   多参数:
  1. {{[item.shop_lng,item.shop_lat]|shop_position }}
复制代码
   多参数 方法接收:
  1. Vue.filter('shop_position', function([lng,lat]) {
  2.                                
  3.                                 var this_point = new BMap.Point(lng,lat)//new BMap.Point(lng, lat);
  4.                                
  5.                                 var dis = BMapLib.GeoUtils.getDistance(self_point,this_point);
  6.                                 if(dis>1000){
  7.                                         dis = parseInt(dis/1000);
  8.                                         return dis+"km"
  9.                                 }else{
  10.                                         dis = parseInt(dis);
  11.                                         return dis+"m"
  12.                                 }
  13.                                
  14.                                
  15.                                
  16.                                
  17.                         });
复制代码



回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|小黑屋|极客蜗牛

GMT+8, 2019-3-24 23:33 , Processed in 0.052236 second(s), 24 queries .

Powered by Discuz! X3.4

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表