每天记录一个知识点（vue中 封装使用自己的js方法）

vue中使用自己的js方法

不废话直接上过程（打卡：2020-12-21 ）

一、src下新建utils（自己命名）文件夹，新建index.js（自己命名）文件

二、index.js(推荐三种写法)

 1. 第一种写法
	export default {
		aaa(){
			return alert('aaa')
		},
		bbb(){
			return alert('bbb')
		}
	}

 2. 第二种写法
	function aaa() {
	   return alert('aaa')
	}
	function bbb() {
	    return alert('bbb')
	}
	export default {
	    aaa,
	    bbb
	}
	

 3. 第三种写法
    const utils = {
	  aaa() {
	    return alert('aaa')
	  },
	  bbb() {
	   return alert('bbb')
	  }
	}
	export default utils

其实都一样，就是导出一个js文件，看个人习惯

三、挂载

//全局挂载 main.js（推荐，省事）
import utils from './utils/index';
Vue.prototype.$utils = utils;

单个组件挂载 test.vue
import { utils }   from "../utils/index.js";

四、使用

 //全局挂载的使用
 this.$utils.aaa();
 
 //单个组件使用
 this.utils.aaa() 

笔记：

后面会给出日常开发常用的一些方法