Vue.js实现全局公共方法 / 网络研习社#51

对于常用的重复使用的代码，可以把它写成公共方法，然后在全局使用。当然这是一个最用的技巧，也是一种标准的编程方法。

Vue.js中要实现全局方法，可以使用插件的写法。比如npm, 这些包都是些代码高手整理出来通用的方法，你一安装挂载上就可以全局使用！这可以大大加快你的开发进程。

这里不介绍插件的写法，用的是另一个简洁便利的写法，可以制作出全局公共方法。其实在Vue.js中过滤器也可以使用这种方法来写的。

主要有两步:
1.utitls -> 定义方法或变量，export出来
2.main.js中导入并挂载到全局使用。

//utitls-getstr.js
const getstr = function(){
  function randomString(length, chars) {
    let result = ''
    for (let i = length; i > 0; --i) result += chars[Math.floor(Math.random() * chars.length)]
    return result
  }
  return randomString(5, '0123456789abcdefghijklmnopqrstuvwxyz')
}
export {getstr}

//main.js
import {getstr} from "./utils/getstr"
Vue.prototype.getstr = getstr
全局即可使用：this.getstr()

在上面的案例中，假如我们要得到一个生成字符串的方法（这是用于生成网址的），就可以按照如上的方法来实现，在全局即可使用：this.getstr()来得到所想要的字符串的。是不是感觉很实用！