如何自动引入router文件夹下的路由文件，并且自动use注册?我们可以手动引入并注册，但是过于麻烦，最原始的方式就是自己通过读取资源的方式获取，但是已经有插件做这个事件了，省事就直接安装对应的插件即可。yarn add require-directory安装完毕后引入并使用：const Koa = require("koa"); const Router = require("koa-router"); const requireDirectory = require("require-directory"); const a...
同事写的，我也是借花献佛，顺带做个笔记axios拦截器添加取消请求的方法因为我们需要在路由进入前判断有没有存在取消请求的方法，所以需要一个存储介质，选用数组，然后存放在vuex中，一是方便动态追踪，二是本来就在axios和router里面import了vuex，就没必要添加window的全局变量了。import axios from "axios"; import store from "./store"; //vuex //拦截器 api.interceptors.request.use(config => { //设置取消请求的...
一开始被要求这个功能我是一脸蒙蔽的，因为写了这么多vue项目，没有哪个项目要求这么做，况且，作为一个无刷新的前端项目，突然来个刷新，让我有点措不及防。中午和同事吃饭的路由讨论了此事，他说了一个点，让我想到，说不定可以这么做，于是下午百度了一些文章，心里有了思路，顺着这个思路，成功搞定这个需求。思路相同的路由，是不允许重复跳转的，所以不会触发路由守卫，想通过路由守卫处理这条路走不通。有人说通过this.$router.go(0)可以实现页面刷新，我测试了下，确实是页面刷新了，但是我要的是路由页刷新，路由页可能是某个区域，而不是整个网页，所以该方案也行不通。最终只能选择v-if和router...
不久之前，我写了一篇《element ui 侧边栏导航刷新自动展开并高亮》的文章，里面主要讲了怎么对侧边栏导航进行高亮，刷新并依旧保持高亮展开的方法。但是后来我发现我之前的那种思路有些窄了。不太适合更大型的站点开发使用。之前的方法主要讲的是：每个网页对应一个导航栏菜单，此时导航栏菜单和网页是一一对应的，所以我可以使用当前路由的name值来进行高亮。但是，如果有更复杂的情况呢？比如：我的导航菜单只显示两级，剩下的级数不显示，点击三级及以上时怎么办？虽然两个页面在路由配置里是同级路由，但是a路由点击按钮跳转到b路由，b路由有前缀条件，所以不能直接出现在导航菜单里，那么应该已经保持a路由菜单高...
最近遇到如题的一个需求，因为很常用，所以我把它记录下来，方便以后使用。流程用户正常使用时，或者后台刷新了缓存，导致登录超时或者失效，前端api请求得到一个信息，比如code=10010，那么就表示用户登录信息失效了，前端页面就需要提示用户登录失效了，需要重新登录。用户点击确认后，我们删除本地token，然后路由跳转。跳转之前我们需要记录当前的路由，这样用户登录成功后可以跳转回来，体验极好。233...流程示意：登录失效 --> 前端api请求时得到code=10010 --> 弹出提示窗口 --> 用户点击 重新登录 --> 清除token --> ...
一直想找一个动效，因为以前一直都是使用mode="out-in"；这种一般也就fade这种动效好看，如果要更好看一点，就需要花点心思了。效果原理通过给每个路由的自定义属性meta设置一个层级，第一层，第二层，第三层，也可以理解为第一页，第二页，第三页。然后通过这个层级关系判断页面是往左还是往右。源码[hide]vue<template> <div id="app"> <transition :name="transitionName"> <keep-alive&g...
参数koa-router的参数和vue中的router参数一下，一个分号带一个变量名router.get("/news/:id",async ctx=>{ });那么我们要进入这个路径，是一定要带上id的，不然就进不去：loaclhost:8080/news/1231这个id可以是任何值，数字，英文，中文参数也可以多个，这样你访问这个路径也要带上这么多的参数router.get("/news/:id/:a/:eee",async ctx=>{ });路径：localhost:8080/asda/ada/dada如何获取这些参数呢？c...
一定要是使用正统的插件：koa-router，npm官方库有很多擦边球插件，一字之差，所以需要注意了。路由方法路由方法HTTP方法含义.get()GET数组在url中，非特殊约定，一般为urlencoding.post()POST数据在body中.put()PUT数据在body中，一般用于文件上传.patch()PATCH数据在body中，一般用于数据更新.del/delete()DELETE数据在url中，一般用于删除.all() 处理所有的method请求.use() 挂在中间件注意，form表单元素只能提交get和post请求，其他类型的请求需要使用ajax这种方式。其实get和p...
最近写项目遇到一个问题，很头疼，几天了，问了好些大佬，都没有找到问题的解决方案，但是，最后还是被我找到了，可喜可贺...问题有一个home页，home页里面有router-link元素进行子路由切换，为了减少资源损耗，所以直接使用了keep-alive进行路由页缓存，假设有三个子路由abc，a路由页面有两个子路由a-1和a-2，默认是a-1显示。当我们进入到a路由是，默认显示a-1，然后我们切换到a-2，然后路由push返回到home页，再次进入到a页面时，你会发现，a路由此时显示的a-2而不是a-1，但浏览器地址是a-1的地址，此时，我们可能没办法切换到a-1了。问题图为什么主要因为k...
没有更多了
最近评论