网上看了很多,写的都很不清晰。直接上代码
首先我们脚手架创建项目 在文件中自己写两个js
lib/index.js 如下
/*原始的方法如下*/
// function fun_one(){
// addEven();
// }
// function addEven(){
// alert('11111')
// }
//改造后的方法
export default function fun_one(){
addEven();
}
function addEven(){
alert('11111')
}
这里其实很简单,只要将原来的方法暴露出去即可,这里有一个重点一定要注意 export 后面加不加default 都可以,但是在引用的时候一定要注意,后面会说
/*在改造的时候遇到声明一个变量等于一个方法的 这样去改造*/
//原来的
var F =function(){
return (x & y) | ((~x) & z);
}
//改造的
export function F(x, y, z) {
return (x & y) | ((~x) & z);
}
再来看一个js
assets/js/md5.js 如下
这个方法就是没有加 default 的
重点来了我们来看下在组件中怎么使用
在index.vue中
注意没加default 的在 import的时候一定加上{},
import {hex_md5} from '../assets/js/md5.js'
加上default 在 import的时候不需要加{}
import fun_one from '../../lib/index.js'
我们在mounted中直接来使用这两个方法
显示结果如下
首先是弹出
接着打印