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. 欧莱雅浅谈OC中方法调用的顺序中的Category

    OC特有的分类Category,依赖于类.它可以在不改变原来的类内容的基础上,为类增加一些方法.分类的使用注意: (1)分类只能增加方法,不能增加成员变量: (2)在分类方法的实现中可以访问原来类中的 ...

  2. 2016/05/17 thinkphp3.2.2 ① Ajax 使用 ②前端验证

    显示效果: ①Ajax使用:   注意传值的所有过程用的是小写,及时数据库列的名称中有大写字母 控制器部分: AjaxController.class.php <?php namespace H ...

  3. 2015/12/25 ① 图灵测试 ② 安装jdk出现的问题 ③ 配置环境变量

    ①图灵测试 1,解释 图灵测试一词来源于计算机科学和密码学的先驱阿兰·麦席森·图灵写于1950年的一篇论文<计算机器与智能>.阿兰·麦席森·图灵1950年设计出这个测试,其内容是,如果电脑 ...

  4. AJAX请求提交数据

    1,AJAX准备知识:JSON JSON指的是JavaScript对象表示方法(JavaScript Object Notation) JSON是轻量级的文本数据交换格式 JSON独立于语言 JSON ...

  5. 避免表单重复提交(js实现) (转)

    <script language="javascript">       function submitForm(obj){            obj.disabl ...

  6. 通过minicom传送文件的相关配置及使用方法

    写一下我使用串口向开发板传送文件中遇到的问题及解决办法: 使用的软硬件环境: 虚拟机:VMware® Workstation 8.0.1 Linux操作系统:Fedora 9 开发板:mini6410 ...

  7. 简单记录CentOS服务器配置JDK+Tomcat+MySQL

    项目需要部署到一台CentOS的服务器之上,之前这台服务器上面已经安装了一个Nginx和MySQL,跑的是PHP环境,有一个项目正在运行.而我们最新的项目是用Java写的,服务器是用的Tomcat,所 ...

  8. Are you sure you want to continue connecting etc ssh ssh_config StrictHostKeyChecking no

    Are you sure you want to continue connecting (yes/no) 每次ssh 进入一台新机器都会跳出如下的提示: The authenticity of ho ...

  9. ava Double: 四舍五入并设置小数点位数

    public static void main(String[] args) { // 1. 先乘后四舍五入, 再除; double d = 62.31060027198647; double d2 ...

  10. P2210 Haywire(A*)

    P2210 Haywire 题目描述 Farmer John有N只奶牛,(4 <= N <= 12,其中N是偶数). 他们建立了一套原生的系统,使得奶牛与他的朋友可以通过由干草保护的线路来 ...