vue2.x搭建saas项目系列之九：utils、directives、filters、types

此篇幅主要介绍、我们是如何全局管理及使用工具类相关，如有不足和建议请留言，在此感谢，项目目前阶段还处在少年，一直在迭代

一. utils

// 注册 自定义工具函数
import * as ompUtils from '@/utils/utils'
// Register global utils functions
Vue.prototype.$ompUtils = ompUtils 
declare module 'vue/types/vue' {
  interface Vue {
    $ompUtils: any
  }
}

// 使用
this.$fmOmpUtils.getSessionStorage('')

二. directives

// Register global directives
import * as directives from '@/directives'

Object.keys(directives).forEach((key) => {
  Vue.directive(key, (directives as { [key: string ]: DirectiveOptions })[key])
})

// 使用
<el-button
  v-clipboard:copy="https://"
  v-clipboard:success="clipboardSuccess"
  type="primary">
  复制链接
</el-button>

三.filters

// Register global filter functions
import * as filters from '@/filters'

Object.keys(filters).forEach((key) => {
  Vue.filter(key, (filters as { [key: string ]: Function })[key])
})

// 使用
<omp-switch
  @change="switchChange"
  switchClass="open-class"
  :switchState="formModel.state | isAvailableStateFilter">
</omp-switch>

四. types

 

到此，utils、directives、filters、types-文章结束，原创不易，感谢浏览！