vue自定义通用函数（全局函数）

在一个项目中，常常会出现多个地方都要使用到同一个函数的状况，尤为在vue的组件之间是相互独立的状况下，要是每次要使用到函数都要从新定义，这样会显得特别累赘繁琐，也会形成代码的冗余，因此有没有办法注册一个通用的函数供全部组件使用呢？

这就须要咱们来自定义全局函数了，思想跟java的通用工具类基本是同样的，看过我几篇文章的亲们就会知道我作的项目是webpack+vue2.0+...的框架下实现的，因此基于此框架，咱们该如何定义全局函数呢？

一、咱们能够在src目录下新建一个通用的js来存放全局函数，好比我这里是建了util.js,大家也能够取名tool.js之类的，随大家高兴。由于可能会用到其余通用的js，为了代码的规范，我都将他们放到utils的文件夹里了，这些都是自定义的，命名没有强制要求

而后怎么在util.js里面定义全局函数呢，以下：

/*
 *首先是相互调用，接收的地方用import，输出的地方用export
 *好比这里面须要用到cookie.js中的方法，那么就要先把cookie引用进来，这个思想跟后面的引用是一致的
 */
import cookie from './cookie';

/*
 *接下来是定义全局函数
 *由于全局函数是要给外部使用的，因此须要将函数用export告知外部便可
 *好比咱们在这里定义了日期的格式，供后面组件统一改变
 */
//Date对象转化为yyyy-MM-dd格式
export function dateFormat(dateObj){
  var year = dateObj.getFullYear();
  var month = ("0" + (dateObj.getMonth() + 1)).slice(-2);
  var day = ("0" + dateObj.getDate()).slice(-2);
  return year + "-" + month + "-" + day;
}

二、如何调用全局函数，就跟上面提到的同样，那里须要用到就在那个组件的script开始的地方import进util.js的文件，而后调用util里面的函数就好了，以下：

<script>
    import * as util from '../../../utils/util'
    export default {
        data() {
          return {
              //这里调用了util的dateFormat()函数
              outputStartDate: util.dateFormat(new Date()),
          }
        }
    }
</script>