vue登录插件引来的后续问题
上次介绍了下写的登录弹框插件,过了几天发现点击去注册或者改密码的跳转失效。报错this.$router.push is not a function,继续打印this.$router也是undefined
(可以先看一下上一篇博客提到的弹框登录插件)
this.$router.push({ path:'/register'})
尝试了很久,试了三种方法。
需要注意的是:登录弹框是通过this.$login调用方法来动态插入组件的,这个登录弹框不在路由的组件管理范围内。
第一:引入子路由,需要加router-view

但是这样是作为子路由的方式,给当前赋值了路由对象。页面会出现重叠。

第二种:在main.js里把路由对象设为window对象下的某值

然后再loginBod.vue里调用。

结果也能跳转。

但是弹框还在,上面解释过了,路由切换卸载和动态加载不同的组件,但登录弹框是手动挂载上去的,所以需要手动去卸载。

第三种:直接用window.replace

路由router跳转的话,会根据路由对象动态的卸载挂载组件,所以弹框会保留。这种做法是提高性能减少消耗的。默认的路由哈希模式,是去操作哈希值重新定位路径,但是始终是由vue来操作对应的组件资源的。
vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载。
顺便提一下这个点:记住一句话,如果本地跑没问题,推上正式有问题,百分之99都是资源路径的问题。

但是通过window.locaiton.replace,replace() 方法可用一个新文档取代当前文档,Dom直接删除,然后重新加载对应的路径资源。
总结:以上方式,推荐第二种,采用路由跳转,而且手动去卸载,针对性的符合场景式去做解决。
反思:找了半天没明白为什么会没有router对象,routerConfig也写了,只能去先找解决方法,有路过的大神多多指教。
vue登录插件引来的后续问题的更多相关文章
- vue各种插件汇总
https://blog.csdn.net/wh8_2011/article/details/80497620(copy) Vue是什么? Vue.js(读音 /vjuː/, 类似于 view) 是一 ...
- vue封装插件并发布到npm上
vue封装插件并发布到npm上 项目初始化 首先,要创建项目,封装vue的插件用webpack-simple很合适,vue init webpack-simple 项目名称此命令创建我们的项目的目录, ...
- vue 常用插件,保存
UI组件 element- 饿了么出品的Vue2的web UI工具套件 Vux- 基于Vue和WeUI的组件库 mint-ui- Vue 2的移动UI元素 iview- 基于 Vuejs 的开源 UI ...
- 第三方登录插件.NET版XY.OAuth-CSharp
XY.OAuth-CSharp GitHub:XY.OAuth-CSharp OSChina:XY.OAuth-CSharp 第三方登录插件.NET版 使用 首先,从NuGet上安装"XY. ...
- ECshop 快捷登录插件 支持QQ 支付宝 微博
亲自测试可以使用,分享给大家.(承接各种EcShop改版,二次开发等相关项目 QQ:377898650) 安装的时候按照里面说明.安装即可. 代码下载:http://pan.baidu.com/s/1 ...
- nopCommerce 3.9 大波浪系列 之 微信公众平台登录插件
一.简介 插件源码下载:点击下载 微信公众平台网站授权帮助地址:https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp142114084 ...
- nopCommerce 3.9 大波浪系列 之 外部授权登录插件的开发实现
一.简介 nop支持第三方外部授权登录的扩展,本篇通过编写微信公众平台登录插件进一步了解nop授权登录的开发过程. 微信公众平台.微信开放平台使用场景不一样,前者通过微信客户端进行开发如公众号,后者基 ...
- 写一个Vue loading 插件
什么是vue插件? 从功能上说,插件是为Vue添加全局功能的一种机制,比如给Vue添加一个全局组件,全局指令等: 从代码结构上说,插件就是一个必须拥有install方法的对象,这个方法的接收的第一个参 ...
- Vue自定义插件方法大全
新年第一天首先祝大家新年快乐,心想事成! 1.利用根实例构造函数的原型 //在构造函数的原型链上添加自定义属性 Vue.prototype.test = 'pomelo' //在其他组件中调用 con ...
随机推荐
- Unity 双击Esc或者返回退出游戏,有文字提示
第一次点击Esc或者返回,显示提示文字"再次按下返回键退出游戏",在文字消失之前再次点击Esc或者返回,退出游戏. 此脚本挂在Text文字提示上: using UnityEngin ...
- MATLAB循环和函数定义,调用
格式不要括号,最后有end for 循环变量 = 表达式1:表 2:表 3 表1:初值 表2:步长 表3:终值 求圆周率:π/4=1 - 1/3 + 1/5 -1/7+...+(-1 ...
- java语言编程实现两个时间相差多少天、多少小时、多少分、多少秒
不多说,直接上干货! DateDistance.java package zhouls.bigdata.DataFeatureSelection.test; import java.text.Date ...
- Redis入门--(二)Redis的概述
1.Redis的由来 创始人觉得Mysql不好用,就自己写了: 国内使用Redis的网站有新浪微博,知乎: 国外GitHub: VMWare也支持redis的开发 2.Redis的概述 官方提供的测试 ...
- jQuery中的CSS-DOM操作
html代码 <p style="color:blue;">武汉PHP培训-武汉长乐教育</p> css()方法 $("p").css( ...
- XHTML教会我的一些东西-2
不知道写些什么,每次看完视频之后都按照里面的方法把相应的代码写了一遍.感觉问题不大,可能是我没去写那些复杂的代码,没有去思考其他一些新颖的架构. 在自己写代码和看视频的过程中,我明白了,一定要注意每一 ...
- OSI七层模型含义
应用层:由用户自己规定,只要形成的消息能与表示层接口.这包括各机互访协议,分布式数据库协议等. 表示层:是在满足用户需求的基础上,尽可能的节省传输费用而设置的.如文本压缩.常用词转换.加密.变更文件格 ...
- 学习Geodatabase的总结
一.怎样择取自己需要的.有用的资料 1.开始找资料时,首先想到的是ESRI的帮助文档,因为它直接.规范而系统.通读一遍之后,大致了解了Geodatabase的各个方面.再从帮助文档体系结构中选出重要的 ...
- TP5.1:依赖注入、绑定一个类到容器里、绑定一个闭包到容器中
依赖注入 1.在application中创建一个文件夹,名字为commom,commom文件夹中创建被注入文件夹,在被注入文件夹中创建一个名为demo.php的文件 2.在demo.php中输入: 3 ...
- Altium_Designer-PCB的覆铜步骤
1.覆铜的意义 覆铜,就是将PCB上闲置的空间作为基准面,然后用固体铜填充,这些铜区又称为灌铜.敷铜的意义在于,减小地线阻抗,提高抗干扰能力:降低压降,提高电源效率:还有,与地线相连,减小环路 ...