vuecli3学习的第3天(window系统)
发布日期:2021-05-08 09:49:07 浏览次数:0 分类:技术文章

本博客根据腾讯课堂吴老师《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')     }  ]})
上一篇:vuecli3学习的第4天(window系统)
下一篇:vuecli3学习的第2天(window系统)