宁夏建设学院官方网站,制作音乐网站实验报告,山西网站建设怎么样,辽宁省建设工程信息网排名需求#xff1a;
目录
1.配置路由
2.less使用 vue2使用以下版本
3.axios二次封装 1.配置路由
1.1.1 官方链接#xff1a;安装 | Vue Router npm i vue-router3.6.5 注意#xff1a;vue2项目不能用vue-router四版本以上 1.2.1.创建router/index.js 在该文件中
//1.引…需求
目录
1.配置路由
2.less使用 vue2使用以下版本
3.axios二次封装 1.配置路由
1.1.1 官方链接安装 | Vue Router npm i vue-router3.6.5 注意vue2项目不能用vue-router四版本以上 1.2.1.创建router/index.js 在该文件中
//1.引入 vue和vueRouter
import Vue from vue
import VueRouter from vue-router
//2.使用插件
Vue.use(VueRouter)import Hello from ../views/Hello
import Home from ../views/Home//3.对外暴露
export default new VueRouter({routes: [{path:/home,component:Home},{ path: /hello,component: Hello},]})
1.3.1在main.js中配置 创建和挂载根实例 1.4.1如何使用呢 1.4.1.声明式导航
templatediv idapp//声明式导航
router-link to/homegotohome/router-linkrouter-link to/hellogotohello/router-link//出口文件 显示在哪里router-view/router-view/div
/template 1.4.2.编程式导航 2.less使用 vue2使用以下版本
npm i less4.1.2
npm i less-loader6.0.0 style langless 3.axios二次封装
3.1.1 npm install axios
3.1.2创建api文件夹 和request.js 3.1.3 requst.js 文件如下
// 二次封装axios
import axios from axios// 创建axios对象
const request axios.create({baseURL:/api,timeout:5000,
})// 请求拦截器在请求发出前做事情
request.interceptors.request.use((config){// config:配置对象对象里面有请求头return config
})// 响应拦截器
request.interceptors.response.use((res){return res.data;
},(error){return Promise.reject(new Error(faile))
})export default request; 3.2.1api中的index.js文件配置
import request from ./request;// 请求首页数据
// export const getData(){
// return request.get(/home/getData)
// }
// export const getData2(){request({method:get, url:/home/getData})}export const getData()request({method:get, url:/home/getData})
