【Vue】filter 封装

filter.js

/**
 * Created by ZOE on 20/03/18
 */

/** format template String
 * ellipsis 字符串切割 
 * transDateSub 截取时间戳(10位)
 * 
 * 
 * 
 */
import { parseTime} from '@/utils/index'
const filters = {
	ellipsis: function (str, len){//字符串切割
		if(str.length*2 <= len) {
	    return str
	  }
	  var strlen = 0
	  var s = ""
	  for(var i = 0;i < str.length; i++) {
      s = s + str.charAt(i)
      if (str.charCodeAt(i) > 128) {
        strlen = strlen + 2
        if(strlen >= len){
            return s.substring(0,s.length-1) + "..."
        }
      } else {
        strlen = strlen + 1
        if(strlen >= len){
            return s.substring(0,s.length-2) + "..."
        }
      }
	  }
	  return s
	},
  transDateSub: function (val){
    if(val){
      return parseTime(val).substring(0, 10)
    }else{
      return '--'
    } 
  }
}
export default (Vue) => {//导出所有filters
  Object.keys(filters).forEach(key => {
      Vue.filter(key, filters[key])
  })
}

main.js

import filters from './utils/filter'//引入全局filter
filters(Vue)//注册全局filter

index.vue

<template>
<div>
    <span>{{scope.row.address | ellipsis(32)}}</span>
</div>
</template>
<script>
let ellipsis = Vue.filter('ellipsis')//引入全局filter
</script>

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值