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>