vue 路由 router.js
文章平均质量分 50
前端不加班
本人所写文章内容主要是为了方便自己看,如文章有错误的地方,请多担待!
展开
-
vue--横向切换手风琴动画效果demo + div悬浮感(hover属性触发)
可以给img 添加hover属性。原创 2022-12-13 16:55:09 · 731 阅读 · 0 评论 -
VUE中路由变化this.$router(push\replace\go\back)
描述:同样是跳转到指定的url,但是这个方法不会向history里面添加新的记录,点击返回,会跳转到上上一个页面。上一个记录是不存在的。用法:同this.$router.push()描述:跳转到指定的url,原创 2023-01-13 14:06:26 · 544 阅读 · 0 评论 -
vue项目中对axios进行二次封装
除了在请求头中配置之外,我们还需要对请求体中的数据进行处理,例如在进行post请求的时候,axios默认会将我们的请求体数据转化成json格式,所以如果后台需要的数据为json格式,可以不进行配置,但是如果后台需要urlencoded格式的数据,则需要借助qs来快速帮助我们进行转码。在项目开发的过程中,往往会有很多的请求接口,如果我们都将接口写在同一个文件,不利于我们的后期开发和维护,所以,对于api我们采用模块化的方式进行分类管理,这样有利于后期维护。最重要的是它具有请求拦截器和响应拦截器。原创 2023-01-13 13:47:24 · 1087 阅读 · 0 评论 -
vue 之 CSS进行样式穿透的方法(/deep/、::v-deep、>>> 、:deep、额外的全局<style>)
在很多vue的组件库 , 如vant,elementUI, iview等都可能自定义一些样式文件,如果我们在项目中引入了样式组件或者通过v-html渲染了数据,然后想要去修改他们内部的某元素的样式, 直接修改样式很可能不起作用,修改无效, 但如果直接去掉scoped话又会影响全局样式,令人头疼。进行样式穿透,既适用于CSS,适用于Sass、Less等预处理器,但问题是在vue-cli3以上版本创建的vue项目不再被支持。进行样式穿透,但是只适用于原始CSS,不适用于 Sass、Less等预处理器。原创 2023-01-13 10:55:01 · 820 阅读 · 0 评论 -
Vue中 与keep-alive有关的生命周期
官网说其是在服务器端渲染期间不被调用,说白了其就是在挂载后和更新前被调用的。但如果该组件中没有使用缓存,也就是没有被包裹的话,activated是不起作用的。在开发Vue项目的时候,大部分组件是没必要多次渲染的,所以Vue提供了一个内置组件keep-alive来缓存组件内部状态,避免重新渲染,如果没有缓存,每点击一次导航,内容区就会创建一个组件,该组件会经历整个生命周期,每点击一次,就会创建一个组件,比较浪费性能。keep-alive组件停用时调用。原创 2023-01-12 11:10:24 · 915 阅读 · 0 评论 -
Vue: qs的使用方法
方法二:将对象序列化,多个对象之间用&拼接(拼接是由底层处理,无需手动操作)原创 2023-01-12 10:22:33 · 446 阅读 · 0 评论 -
axios.defaults.withCredentials = true 前端跨域传递Cookie设置
不然cookie不会出现在http的请求头里,所以报错里说Access-Control-Allow-Origin不能是。另外,Access-Control-Allow-Origin不能设置为。XMLHttpRequest的Ajax请求。但是前端这样设置之后发现报错了。JQuery的Ajax请求。axios的Ajax请求。原创 2023-01-12 10:18:42 · 1312 阅读 · 0 评论 -
vue中$event的使用
console.log(aoe.srcElement): 即方法中的参数 $event的srcElement属性 ↓↓↓。$event此时是获取的dom元素 即 MouseEvent鼠标点击的这个按钮元素,(可理解为当前标签的属性)自定义组件(比如自定义父子组件或者elementui/iview组件)的$event。console.log(aoe): aoe即方法中的参数 $event ↓↓↓。代表的就是济南青岛这个选中的值,此时。html原生的$event。event就代表传参。原创 2023-01-09 13:33:44 · 1414 阅读 · 0 评论 -
vue pc项目 router.js 配置详解 ,vue项目中路由懒加载的正确使用,vue实现动态路由一步到位
这个是我之前一个项目的router.js 文件xmjd路由懒加载:使用() => import();的方式导入组件这样可以在进入当前路由的时候加载路由如果不使用懒加载 会在第一次进入页面后 一次性加载所有路由 所以首屏加载会慢如果一个项目过大 大量的使用路由懒加载会导致页面的热更新过慢推荐在开发环境下不使用懒加载 这样有利于开发的效率在生产环境可以使用路由懒加载通过process.env.NODE_ENV可以访问到当前是什么环境可以在utils文件夹下创建两个文件util.import.原创 2022-11-17 15:54:25 · 4444 阅读 · 0 评论