本博客根据腾讯课堂吴老师《VueCli3实战项目-还原饿了么订餐app(短信验证码登录和高德定位)》编写。讲课很好,如果有想学习欢迎加入。
axios的配置
axios安装
cnpm install axios --save
在main.js 中
import axios from axios
Vue.prototype.
a
x
i
o
s
=
a
x
i
o
s
;
可
以
全
局
引
用
axios =axios; 可以全局引用
axios=axios;可以全局引用axios发送请求
vue跨域请求
在根路径下创建文件vue.config.js
module.exports = {
devSever:{
open:true,
host:'localhost',
port:8080,
https:false,
hotOnly:false,
// 跨域
proxy: {
'/api': {
target: 'https://ele-interface.herokuapp.com/api/',
ws: true,
changOrigin: true,
pathRewrite: {
'^/api':''
}
}
},
before: app=>{}
}
}
制作一个tabbar组件
const router = new Router({
mode: 'history',
base: process.env.BASE_URL,
routes: [
{
path: '/',
// name: 'index',
component: () => import('./views/index.vue'),
children:[
{
path:'',
redirect: '/home'
},
{
path:'/home',
name: 'home',
component: () => import('./views/Home.vue')
},
{
path:'/order',
name: 'order',
component: () => import('./views/Order.vue')
},
{
path:'/me',
name: 'me',
component: () => import('./views/Me.vue')
}
]
},{
path: '/login',
name: 'login',
component: () => import('./views/Login.vue')
}
]
})