在 Vue 中封装公用方法

我们在项目中常常需要对一些请求参数做处理，例如给所有请求的关键参数去除首尾空格，所有空格，等等，但是我们如果一个个去监听组件变化无疑是非常耗费精力的，所以我们需要封装一个或多个公用的方法，在我们需要的地方去引用就可以。

• 我们在 src 目录下新建 util 文件夹，在文件夹里新建 globalUtil.js 文件用来存储我们的公用方法

//     src/util/globalUtil.js
/**
* 说明：自定义函数或常量；
* 范围：全局引用的函数及变量；
* 适用：需大部分功能均有适用，或需大量适用，否则不再该文档内定义；
* */

exports.install = function (Vue, options) {
 //删除字符串所有空格
 Vue.prototype.gd_delSpace = function (val){
   //return val===''?val.toString().replace(/\s*/g,""):'';
   // return typeof val==='string'?val.toString().replace(/\s*/g,""):val;
   return typeof val==='string'?val.trim():val;
 };
};

• 我们封装的方法必须是 面向大部分功能的，如果你需要处理的地方不是很多，可以自己在组件内封装方法调用即可。我们封装好之后 在 main.js 里面引用到全局就可以了

// main.js
import globalUtil from './util/globalUtil'//自定义全局函数/常量
Vue.use(globalUtil);

• 在使用的时候我们直接用 this.+我们封装的方法名称即可

this.queryMsg.name = this.gd_delSpace(this.queryMsg.name)