实现网页中类似vue.use(element)方法,自建高大上组件
Posted uimeigui
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了实现网页中类似vue.use(element)方法,自建高大上组件相关的知识,希望对你有一定的参考价值。
在方法实现上,使用vue中axios方法封装实现例子
import axios from ‘axios‘ //导入axios 包 axios.defaults.baseUrl="localhost:8080"; axios.interceptors.request.use((config)=>{ let token=localstorage.getItem("token"); //本地取token if(token){ config.headers.token="token"; //设置头部携带token; } return config; //记得返回config哦,不然数据请求会出错 }); //一个简单的axios封装已经实现,接下来实现要实现的vue.use()效果 const install=(vue)={ //核心,通过install事件注册; if(install.installed ){ return; //返回不执行下一步 } Object.defineProperties(vue,{ $api(){ return axios; } }) } export default install; //main.js,接下来就可以在main.js中引用实现vue.use(效果了o) import api from ‘axios封装所在目录‘ vue.use(api) //效果实现,是不是很简单
以上是关于实现网页中类似vue.use(element)方法,自建高大上组件的主要内容,如果未能解决你的问题,请参考以下文章
vue自定义组件(通过Vue.use()来使用)即install的使用