一.问题描述: 1. 跳转模式:界面A-->界面B(界面A中通过 this.$router.push({name:'组件B名称', params: {参数}}) 通过打开新tab页的方式打开界面B.) 2.关闭界面B,回到界面A 3.再次从A到B时,打开的界面B仍然是上次的状态,哪怕传递的参数不一样. 另:router声明如下 { path: 'demo/pageB', name: 'pageB', component: _import('demo/pageB'), meta: { requir…

通过vue学习一:新建或打开vue项目,创建好项目后,接下来的操作为: src目录重新规划——>新建几个页面——>配置这几个页面的路由——>给根实例注入路由配置 src目录重整 在项目中创建如下对应的文件 ├── App.vue // APP入口文件 ├── api // 接口调用工具文件夹 │ └── index.js // 接口调用工具 ├── components // 组件文件夹,目前为空 ├── config // 项目配置文件夹 │ └── index.js // 项目配置文…

*号通配404默认页面…

router.beforeEach(function(to,from,next){ console.log('路由拦截') console.log(to.name) console.log(from.name) if(to.name=='login'){ next(); }else{ if($.cookie('userIsLogin')=='true'){ next(); }else{ next({path:'/login'}); } } }) 我的登录地址是login,如果userIsLogi…

我发现tab页中<script src="xxx.js">方式加载的脚本没有生效,firebug看请求也没有请求相应的脚本文件. 单独在浏览器中打开tab页中的页面js脚本请求和加载都没有问题. 之前还以为是诡异的缓存原因,查了资料才知道tab页中加载的是html片段,也就是body中的部分,写在head中的内容会在解析中被过滤掉. 然后把<script src="xx.js">挪到body中,问题就解决了.…

昨日内容回顾 0. 组件注意事项!!! data属性必须是一个函数! 1. 注册全局组件 Vue.component('组件名',{ template: `` }) var app = new Vue({ el: '#app' }) 2. 注册局部组件 var app = new Vue({ el: '#app', components:{ 局部组件名:{ template: `...` } } }) 3. 传值 1. 父组件 --> 子组件 1. 父组件通过 v-bind:变量='值' 2.…

前言:之前发表过一篇  JS组件系列——基于Bootstrap Ace模板的菜单和Tab页效果分享(你值得拥有) ,收到很多园友的反馈,当然也包括很多诟病,因为上篇只是将功能实现了,很多细节都没有处理,这篇博主将带领大家一起来优化这里的效果,使之成为一个可以在项目里面使用的成品. 说点题外话,本来,在互联网模式下,Tab页+iframe的组合是不能被大多数平台接受的,从这些年推出的一些好的产品可以看出,几乎大家都不这么玩,即使是一些后台的管理模板,比如常见的AdminLTE.Ace.INSPIN…

实现思路及细节 1.利用前面博客所讲的Vuex的知识:定义几个变量 Options:存放tab页对象的容器(主要是路由路径以及tab页的名字) activeIndex:被激活的tab页路由路径 showName:tab页的标题 Role:用来区分是否是因为左侧菜单被点击造成的路由路径发生改变: 是:pass:不是:nopass 2.左侧导航菜单绑定点击事件 将被点击的菜单名称存放到Vuex中,供路由路径变化监听时,tab页标题显示: 标记一下role为pass,到时新增tab页的时候需要作为判断…

一.问题描述 使用easyui搭建的上左右页面布局,当我们在右侧打开了tab页,发现点击浏览器的刷新按钮后,整个页面会被重新渲染,导致所有打开的tab页都被关闭,回到初始状态的问题. 这个问题虽然不影响业务,但对用户操作造成了一定的困扰.因为浏览器刷新后,tab页全部被关闭,那么用户又需要打开刚才正在使用的tab页,甚至有可能,用户会忘记打开过哪些tab页. 二.解决思路 因为浏览器刷新后,页面重新渲染,所有tab页都不存在了,其实并不是关闭了tab,只是页面回到了初始状态.所以要解决这个问题,…

最近做的项目中,涉及vue router 路由操作,其操作方法不同,产生的行为亦不同.本文通过对比实验,对其行为进行实验对比及总结,避免混淆. vue router的单页跳转的history模式,类似HTML5 history方式,两者使用的API类似.  1.测试介绍 1.1.测试分两种跳转方式 a.单页 <-> 单页:单页内的跳转(通过vue router的方式跳转): b.单页 <-> 普通页:单页到普通页面的跳转(或者通过href.window.location的方式跳单页…