-
模板内获取数据:this.$route.params.id
-
注意这个方式参数字段名 id 要在路由配置中定义 用冒号的形式标记
-
参数可以继续拼接 /student/:id/:name/:age/:address
-
他必须严格按照 url 的配置格式访问
3. 如何选择哪一个传参方式
===============
两个并没有高低之分
-
动态路由, 优点 ,好看整齐 缺点 必须预先定义, 如果参数多起来多起来不好管控
-
问号的形式 灵活随意想改就改, 想加就加, 缺点就是太丑陋了, 也不直观
params:/router1/:id , //router1/123,/router1/789 ,这里的id叫做params
query:/router1?id=123 , //router1?id=456 ,这里的id叫做query。
query 传参配置的是path,而params传参配置的是name,在params中配置path无效
query在路由配置不需要设置参数,而params必须设置
query传递的参数会显示在地址栏中
params传参刷新会无效,但是query会保存传递过来的值,刷新不变 ;
接收参数使用this.$router后面就是搭配路由的名称就能获取到参数的值
//query:
{
path: ‘/home’,
name: Home,
component: Home
}
// params:
{
path: ‘/home/:id’,
name: Home,
component: Home
}
接口封装
====
import axios from ‘axios’
import qs from ‘qs’
import Vue from ‘vue’
import store from ‘@/store’
// 创建一个 axios 实例
const service = axios.create({
withCredentials: true, // send cookies when cross-domain requests
timeout: 5000 // request timeout
})
// 请求拦截
service.interceptors.request.use(
config => {
// do something before request is sent
if (config.isLoading) loadingInstance = Vue.prototype.$baseLoading()
if (process.env.NODE_ENV === ‘development’) {
config.headers[‘debugMode’] = ‘true’
}
return config
},
error => {
retu
真题解析、进阶学习笔记、最新讲解视频、实战项目源码、学习路线大纲
详情关注公中号【编程进阶路】
rn Promise.reject(error)
}
)
// 响应拦截
service.interceptors.response.use(
response => {
const res = response.data
if (res.intRes === 1) { // 登录请求退出
if (store.getters.empId) { // 如果登录过,提示会话失效
Vue.prototype.$baseConfirm(‘会话已失效请重新登录’, ‘会话失效’, () => {
window.location.href = process.env.VUE_APP_BASE_SSO_URL + window.location.href
})
}
return res
}
最后
面试一面会问很多基础问题,而这些基础问题基本上在网上搜索,面试题都会很多很多。最好把准备一下常见的面试问题,毕竟面试也相当与一次考试,所以找工作面试的准备千万别偷懒。面试就跟考试一样的,时间长了不复习,现场表现肯定不会太好。表现的不好面试官不可能说,我猜他没发挥好,我录用他吧。
96道前端面试题:
常用算法面试题:
前端基础面试题:
内容主要包括HTML,CSS,JavaScript,浏览器,性能优化
好,我录用他吧。
96道前端面试题:
- [外链图片转存中…(img-3M5ANfQ7-1720897302233)]
常用算法面试题:
- [外链图片转存中…(img-pnq7At25-1720897302235)]
前端基础面试题:
内容主要包括HTML,CSS,JavaScript,浏览器,性能优化