【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>