原因解析: vue项目中,页面/路由跳转后,body 的内联样式变成 overflow:hidden

解决方案: 使用路由守卫,在页面/路由跳转后,将body 的overflow设置为auto

src/main.js:

// 解决bug:页面/路由跳转后,滚动条消失,页面无法滚动
router.afterEach((to, from, next) => {
document.querySelector("body").setAttribute("style", "overflow: auto !important;")
});

vue【解决方案】页面/路由跳转后,滚动条消失,页面无法滚动的更多相关文章

  1. 解决vue单页路由跳转后scrollTop的问题

    作为vue的初级使用者,在开发过程中遇到的坑太多了.在看页面的时候发现了页面滚动的问题,当一个页面滚动了,点击页面上的路由调到下一个页面时,跳转后的页面也是滚动的,滚动条并不是在页面的顶部 在我们写路 ...

  2. react-router(v4) 路由跳转后返回页面顶部问题

    遇到的问题 由A页面跳转到B页面,B页面停留在A页面的位置,没有返回到顶部. 问题分析 首先分析下出现此问题的原因: 在项目中使用的是 hashHistory,它是建立在 history 之上的,当路 ...

  3. vue路由跳转取消上个页面的请求和去掉重复请求

    vue路由跳转取消上个页面的请求和去掉重复请求 axios 的二次封装(拦截重复请求.异常统一处理) axios里面拦截重复请求

  4. Vue路由跳转时显示空白页面,iview的使用

    最近在用iview做项目,需要实现登录,注册,忘记密码等功能.iview-admin本来就有登录功能,于是想照葫芦画瓢,实现登录界面的注册,忘记密码页面路由跳转. router.js里路由配置,刚开始 ...

  5. Vue编程式路由跳转传递参数

    Vue 有时在路由跳转时需要用到一些原页面里的数据,用以下方法: 1.在跳转页的方法里写下query参数 TableChange(scope){ this.$router.push({ path:'d ...

  6. vue 所有的路由跳转加一个统一参数

    需求是什么 所有的路由跳转加一个统一的参数 实现方式 先深入理解一下router的全局前置守卫 router.beforeEach((to, from, next) => { const que ...

  7. vue二级路由跳转后外部引入js失效问题解决方案

    vue路由可以通过children嵌套,于是可以形成二级路由等等... 案例如下: routes: [ { path: '/', name: 'dy', component: dy, children ...

  8. 「实践篇」解决微前端 single-spa 项目中 Vue 和 React 路由跳转问题

    前言 本文介绍的是在做微前端 single-spa 项目过程中,遇到的 Vue 子应用和 React 子应用互相跳转路由时遇到的问题. 项目情况:single-spa 项目,基座用的是 React,目 ...

  9. vue中通过路由跳转的三种方式

    原文:https://blog.csdn.net/qq_40072782/article/details/82533477 router-view 实现路由内容的地方,引入组件时写到需要引入的地方需要 ...

  10. 简单单页面路由跳转demo

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. MQ(为什么要使用MQ)

    为什么使用MQ? 个人认为主要由几下几点: 1.在高并发环境下,由于来不及同步处理,请求往往会发生堵塞,比如说,大量的insert,update之类的请求同时到达数据库,直接导致无数的行锁表锁,甚至最 ...

  2. button 样式 触发器

    <Style x:Key="Style.OkOperationButton" TargetType="ButtonBase"> <Setter ...

  3. U-Boot 常用命令介绍

    U-Boot简介 U-Boot常用命令 帮助类 - help/?:该命令输出u-boot支持的所有命令及命令的功能 - help/? cmd:可以查看相应cmd的详细介绍及使用方法 查询类 - bdi ...

  4. 量子图形加密算法的MATLAB代码实现

    一.概述 目前主流的量子图形加密算法有量子像素编码算法(Quantum Image Pixel Encoding,QIPE).量子像素置乱算法(Quantum Image Pixel Scrambli ...

  5. Java笔记第二弹

    List常用集合子类的特点 ArrayList底层数据结构是数组 查询快,增删慢 LinkedList底层数据结构是链表 查询慢,增删快 练习: //ArrayList实现 import java.u ...

  6. URule规则引擎

    没有规则,不成方圆: 一.背景 前段时间,在做项目重构的时候,遇到很多地方需要做很多的条件判断.当然可以用很多的if-else判断去解决,但是当时也不清楚怎么回事,就想玩点别的.于是乎,就去调研了规则 ...

  7. MySQL Mock大量数据做查询响应测试

    上个迭代版本发布后,生产环境业务同事反馈仓配订单查询的页面加载时间过长. 因为页面原来是有的,这次开发是在原来基础上改的,因此没有额外做性能.测试环境只调用接口请求了少量数据去验证功能.在对比该迭代添 ...

  8. Vue模板语法 && 数据绑定

    模板语法 Vue模板语法包括两大类 插值语法 功能:用于解析标签体内容. 写法:{{xxx}},xxx是js表达式,可以直接读取倒data中所有区域. 指令语法 功能:用于解析标签(包括:标签属性.标 ...

  9. UI界面实现SSH登录服务器并执行命令监控

    一.通过paramiko实现SSH远程登录服务器.执行命令并返回信息: 二.通过wxpython实现UI化: 三.代码实现如下: 1)主程序MainUI #coding:utf8 #!/usr/bin ...

  10. Redis 性能优化

    一.Linux 操作系统 [1]ulimit 与 TCP backlog:1).修改 ulimit:通过 ulimit 修改 open files 参数,redis 建议把 open files 至少 ...