beforeRouteEnter在每次路由切换都执行 ,而项目优化后,切换路由mounted只在最开始执行一次

beforeRouteEnter的具体用法可参考官方文档 https://cn.vuejs.org/v2/guide/migration-vue-router.html#activate-替换

需要注意的是：
在这期间路由跳转携带的数据发生改变会影响原数据，他们都指向同一个内存地址,修改其中一个变量，会影响到其他所有变量，可通过
 vm.form = JSON.parse(JSON.stringify(vm.$route.params))  方式解决

vue-router之 beforeRouteEnter的更多相关文章

  1. Vue Router路由守卫妙用：异步获取数据成功后再进行路由跳转并传递数据，失败则不进行跳转

    问题引入 试想这样一个业务场景: 在用户输入数据,点击提交按钮后,这时发起了ajax请求,如果请求成功, 则跳转到详情页面并展示详情数据,失败则不跳转到详情页面,只是在当前页面给出错误消息. 难点所在 ...

  2. Vue Router的配置

    1.beforeEnter function requireAuth (route, redirect, next) { if (!auth.loggedIn()) { redirect({ path ...

  3. Vue躬行记（8）——Vue Router

    虽然Vue.js未提供路由功能,但是官方推出了Vue Router(即vue-router库),以插件的形式支持.它与Vue.js深度集成,可快速的创建单页应用(Single Page Applica ...

  4. vue Router——进阶篇

    vue Router--基础篇 1.导航守卫 正如其名,vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航.有多种机会植入路由导航过程中:全局的, 单个路由独享的, 或者组件级的 ...

  5. Vue Router的导航解析过程

    在我没读官方的vue router文档之前,我怎么也没想到路由的解析过程竟然有12步. 12步如下: 导航被触发. 在失活的组件里调用离开守卫beforeRouteLeave . 调用全局的 befo ...

  6. Vue.js路由管理器 Vue Router

    起步 HTML <script src="https://unpkg.com/vue/dist/vue.js"></script> <script s ...

  7. Vue Router 路由守卫：完整的导航解析流程

    完整的导航解析流程 1 导航被触发. 2 在失活的组件里调用离开守卫. 3 调用全局的 beforeEach 守卫. 4 在重用的组件里调用 beforeRouteUpdate 守卫 (2.2+). ...

  8. Vue Router的简单了解

    Vue Router Vue Router官方文档 传统Web项目开发往往采用超链接实现页面之间的切换和跳转.Vue开发的是单页面应用(Single Page Application,SPA),不能使 ...

  9. Vue 2.0 + Vue Router + Vuex

    用 Vue.js 2.x 与相配套的 Vue Router.Vuex 搭建了一个最基本的后台管理系统的骨架. 当然先要安装 node.js(包括了 npm).vue-cli 项目结构如图所示: ass ...

  10. vue router 只需要这么几步

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

随机推荐

  1. Thinkpad升级Window10无法安装expresscache

    本人有一台Thinkpad T440s,自从看了这篇帖子12秒开机!ExpressCache SSD缓存加速,就给自己的小黑加持了一块固态硬盘.使用后效果确实很明显. 问题 自从系统自动升级到wind ...

  2. 2016/05/19 thinkphp 3.2.2 文件上传

    显示效果:  多文件上传.  这里是两个文件一起上传 上传到文件夹的效果: ①aa为调用Home下common文件夹下的function.php  中的rname方法  实现的 ②cc为调用与Home ...

  3. /dev/zero和/dev/null的区别

    http://www.cnblogs.com/jacktu/archive/2010/06/28/1766791.html /dev/zero和/dev/null的区别   使用/dev/null 把 ...

  4. Deep Learning 28：读论文“Multi Column Deep Neural Network for Traffic Sign Classification”-------MCDNN 简单理解

    读这篇论文“ Multi Column Deep Neural Network for Traffic Sign Classification”是为了更加理解,论文“Multi-column Deep ...

  5. YTU 2851: 数字游戏

    2851: 数字游戏 时间限制: 1 Sec  内存限制: 128 MB 提交: 164  解决: 85 题目描述 输入若干个正整数,将其中能写成其它两个正整数的平方和的数输出来. 例,若输入的数中有 ...

  6. HDU - 2586 How far away ？（离线Tarjan算法）

    1.给定一棵树,每条边都有一定的权值,q次询问,每次询问某两点间的距离. 2.这样就可以用LCA来解,首先找到u, v 两点的lca,然后计算一下距离值就可以了. 这里的计算方法是,记下根结点到任意一 ...

  7. 【POJ 3107】 Godfather

    [题目链接] 点击打开链接 [算法] 这题描述有些繁琐,先简化一下题意 : 对于一棵无根树,删除一个节点,使得其余的联通块中,最大的联通块最小 那么,这题就很好做了 对这棵树进行一遍DFS,求出每个节 ...

  8. UI：网络请求

    JSON 外层是一个数组或者字典 富文本(相对来说比较安全).超文本,https安全超文本协议 NSURL NSURL *url = [[NSURL alloc]initWithString:@&qu ...

  9. Swift4 类与继承, 类型转换, 类型判断

    创建: 2018/03/05 完成: 2018/03/07 更新: 2018/03/09 完善标题 [Swift4 类与继承, 类型转换] -> [Swift4 类与继承, 类型转换与判断] 补 ...

  10. bzoj 3122: [Sdoi2013]随机数生成器【BSGS】

    题目要求的是: \[ ...a(a(a(ax+b)+b)+b)+b...=a^nx+a^{n-1}b+a^{n-2}b+...+b\equiv t(mod\ p) \] 后面这一大坨看着不舒服,所以考 ...