vue路由加载页面时,数据返回慢的问题 - 蓝蓝设计_UI设计公司

帝皇彩票官网

追求卓越一诺千金

蓝蓝设计,2011年成立,主创清华团队,专注软件和互联网ui设计开发。擅长企业信息化管理、监控、大数据软件UIUE咨询和设计开发服务。立足UI,好好学习,天天进步!


vue路由加载页面时,数据返回慢的问题

2019-6-19 释然 前端及开发文章及欣赏


如果您想订阅本博客内容,每天自动发到您的邮箱中,

场景:

vue路由加载页面时,数据返回慢的时候页面会有闪动的效果,数据加载前和加载后的区别。(特别是el-table表格数据)

思路:

路由前加载数据,等数据加载完再路由渲染页面

解决方案:

使用vue-router的 路由守卫 beforeRouteEnter,组件内直接定义以下路由导航守卫,和钩子函数的写法一样,下面列出三种路由守卫:

 beforeRouteEnter(to,from,next)0{
        // 在渲染该组件的对应路由被 confirm 前调用// 不!能!获取组件实例 `this`
        // 因为当守卫执行前,组件实例还没被创建
    } 复制代码
 beforeRouteUpdate(to,from,next){
        // 在当前路由改变,但是该组件被复用时调用
        // 举例来说,对于一个带有动态参数的路径 /foo/:id,在 /foo/1 和 /foo/2 之间跳转的时候,
        // 由于会渲染同样的 Foo 组件,因此组件实例会被复用。而这个钩子就会在这个情况下被调用。
        // 可以访问组件实例 `this`
    } 复制代码
 beforeRouteLeave(to,from,next){
        // 导航离开该组件的对应路由时调用// 可以访问组件实例 `this`
    } 复制代码

vue-router详细,具体访问: 

蓝蓝设计www.bjhbys.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 平面设计服务


标签: vue路由加载页面时 数据返回慢的问题 « 帝皇彩票官网图片排版找不到灵感?送你17个实用技巧! | 交互设计到底是什么?»


蓝蓝帝皇彩票官网 http://www.bjhbys.com

订阅Rss
快赢彩票 状元彩票官网 桔子彩票登陆 状元彩票平台 状元彩票计划 新疆喜乐彩走势图 桔子彩票平台 帝皇彩票 桔子彩票登陆 福建快3