项目中,发现有多个页面的数据内容相同,只是请求数据的参数不同,就可以使用同一个组件来渲染 这里的客户列表 / 我负责的 / 我参与的 都使用同一个组件,不同点在请求数据的参数 可以看到,通过钩子函数,判断路由name,从而修改请求参数,来得到不同的数据内容 这里需要注意三个地方: 1.路由设置 配置路由时,使用相同组件,但是要定义好各自的name 1 { 2 path: "customer_list", 3 component: () => import("@/view

一 小知识回顾 1 级联删除问题 2 一张表关联多个表,比如有manytomanyfileds forignkey,基于对象查询存在的问题:反向查询的时候  表名小写_set.all()不知是哪个字段queryset对象  所以说related_name='coursedetail_by' 3 Vue生命周期钩子可以直接发axios 二 Vue样式用elemen(jq用bootstap) 网站http://element-cn.eleme.io/#/zh-CN/guide/design 1 em

vue如何和ionic的缓存机制一样,可以缓存页面,在A页面跳转至B页面后返回A页面时A页面的数据还在? 在app.vue中将router-view使用keep-alive包起来,使用v-if来判断使用使用被缓存的组件,在keep-alive外面也需要写相同的router-view,用来处理不被缓存的视图组件. 在路由配置里面对需要被缓存的页面进行配置.如下图所示: 这里注意:transition标签下面只能有一个自元素标签,所以使用div将里面的元素包起来. 页面缓存后,页面的部分内容又需要进

prop: include: 字符串或正则表达式.只有匹配的组件会被缓存. exclude: 字符串或正则表达式.任何匹配的组件都不会被缓存. 在2.1.0版本Vue中 常见用法: // 组件 export default { name: 'test-keep-alive', data () { return { includedComponents: "test-keep-alive" } } } <keep-alive include="test-keep-aliv

需求: 产品经理在列表页(几千个数据,n个page)点击某一项进去到详情页后,再返回到列表页发现页面回到了第一页,找不到之前的查看的是哪一条了,为了方便咋公司产品经理,返回列表页时需要记住之前的page页 解决思路: 在列表页点击某一条进入详情页的时候,触发当前页面的keep-alive缓存页面 解决步骤: 1. 设置路由 需要缓存的路由设置 keepAlive : true, 不需要缓存的路由设置 keepAlive: false router index.js [ { path: '/dm'

官网说明: https://router.vuejs.org/zh/guide/essentials/history-mode.html#%E8%AD%A6%E5%91%8A 在linux下搭建nginx测试网页的时候,正常打开可以访问,当刷新后页面出现404 not found的问题 说明: vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载. 如果不想要很丑的 hash,我们可以用路由的 histo

由于项目需求从a页面跳转到b页面,返回a页面,a页面数据不能被刷新掉,方法很多列举12 方法1 a页面通过学期按钮切换学期,该学期里more进入b页面,返回a页面,返回回到对应a页面进入的高亮按钮设置想要缓存的页面 <!-- 缓存所有的页面 --> <keep-alive> <router-view v-if="$route.meta.keepAlive"></router-view> </keep-alive> <ro

1. 通过url带参数传递 1.1 固定参数传递 例如,从 list 页面到 detail 页面, 传递一个或多个固定值 list页面传值: <!--pages/list/list.js--> <navigator url="../detail/detail?id=1&name=名称">点此进入 detail</navigator> detail页面取值: <!--pages/detail/detail.js--> onLoad:

本文地址:http://www.cnblogs.com/veinyin/p/7911292.html 最近学完了基础课程,打算整理一波笔记,对基本概念梳理一遍,惊觉对子路由和单页面多路由混淆的一塌糊涂. 果然,基础课程的坑新手是体会不到的. 由于子路由仅嵌套了一层,多路由给了左右两个组件,而且两个都是在默认组件下进行的.于是,妥妥误会俩作用一样.我发现自己问题,并尝试网上找到区别时,发现并没有人写出来.只好去官网看了一下文档. 哇塞,真是一语惊醒梦中人啊!!! 上面就是官网对子路由的解释,人家说

每天记录一点:NetCore获得配置文件 appsettings.json   用NetCore做项目如果用EF  ORM在网上有很多的配置连接字符串,读取以及使用方法 由于很多朋友用的其他ORM如SqlSugar,NH,Dapper等,在读取连接字符串的时候,往往把信息保存到一个配置文件中,例如appsetting.json, 网上有很多关于读取appsetting.json都是通过注入的方式,  在ORM读取配置的时候,都是在一个类库里面,所以用注入的方式有时候不适合[个人理解] 因以上场景

需求 在开发vue的项目中有遇到了这样一个需求:一个视频列表页面,展示视频名称和是否收藏,点击进去某一项观看,可以收藏或者取消收藏,返回的时候需要记住列表页面的页码等状态,同时这条视频的收藏状态也需要更新, 但是从其他页面进来视频列表页面的时候不缓存这个页面,也就是进入的时候是视频列表页面的第一页 一句话总结一下: pageAList->pageADetail->pageAList, 缓存pageAList, 同时该视频的收藏状态如果发生变化需要更新, 其他页面->pageAList,

angular做单页面应用是一个比较好的框架,但是它有一定的入门难度,对于新手来说可能会碰到很多坑,也有许多难题,大部分仔细看文档,找社区是能解决的. 但有些问题也许资料比较少,最近遇到过一个要缓存父页面的问题,就是点击进入子页后,再返回时父页面的数据要缓存下来,包括滚动条的位置.再做的过程当中查过 许多资料,都说的不很详细,今天把方法记录下来,供参考. 要想缓存,要用到嵌套路由(ui-router): 有三个嵌套的方法: 使用"点标记法",例如:.state('contacts.li

  angularJS学习笔记:页面缓存与页面刷新 遇到的问题 现在存在这样一个问题,登录前与登录成功后是同一个页面,只不过通过ngIf来控制哪部分显示,图像信息如下: 所以,整体工作不是很难,无非就是页面的布局,不过ionic提供了一套UI,可以很方便的布局到这个程度. 但是,当我布局好,接口也连接上以后,测试才发现有些地方有延迟,就像这样: 这个过程这样解释: 点击"我的"进入个人中心 我没有登录,展示的是未登录页面,点击登录 进入登录页面,输入用户名密码并登录成功,返回主页面 点

一.理解路由 传统的页面应用,是用一些超链接来实现页面切换和跳转的.而vue的单页面应用是基于路由和组件的,路由用于设定访问路径,并将路径和组件映射起来. 路由中有三个基本的概念 route, routes, router. 1, route,它是一条路由,由这个英文单词也可以看出来,它是单数, Home按钮  => home内容, 这是一条route,  about按钮 => about 内容, 这是另一条路由. 2, routes 是一组路由,把上面的每一条路由组合起来,形成一个数组.[{

今天正式开始入门篇,也就是实战了~ 首先我们是要做一个博客网站,UI 框架采用江湖传闻中的 ElementUI,今天我们就来利用它确定我们博客网站的基本布局吧. 准备工作 新建一个vue项目(可以参考基础篇里的搭建方法,也可以参考官网现在最近的 Vue CLI 3.x进行可视化创建和管理 安装 vue-router 安装 elementui 以上的操作都可以在之前的博文中(基础篇)找到完整步骤,这里就不重复了. 我们做完准备工作之后,目录结构如下: 我们来看看这个目录: |--public 公共

1.vue组件 组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.组件系统让我们可以用独立可复用的小组件来构建大型应用,几乎任意类型的应用的界面都可以抽象为一个组件树. 注册一个全局组件语法格式如下: Vue.component(tagName, options) tagName 为组件名,options 为配置选项.注册后,我们可以使用以下方式来调用组件: <tagName></tagName> 1. 组件名大小写: 定

翻车事故分析: 因需对项目整体优化,调整过程,采用了路由的history模式,本地项目运行,刷新子页面都是OK的. 部署到测试服务器,正常跳转都ok,但刷新子页面就会出现404,请求变成了get,没有进入封装的请求体中,让人很费解,也有没有打印错误. 1.本地刷新子页面,地址栏路由状态OK,页面也能正常获取数据 2.部署到测试服务器上,刷新就唧唧了 注:首先,说明下vue-router的默认hash模式——使用URL的hash来模拟一个完整的URL,当URL改变时,页面不会重新加载.但是这种ha

Vue. 之 刷新当前页面,重载页面数据 如下截图,点击左侧不同的数据,右侧根据左侧的KEY动态加载数据.由于右侧是同一个页面,在进行路由跳转后,不会再次刷新数据. 解决方案: 右侧的页面中 script代码块添加:watch模块,如下代码: ... ... mounted : function() { this.loadData(); }, watch: { //监听相同路由下参数变化的时候,从而实现异步刷新 '$route'(to,from) { this.loadData(); }, },

跳转详情页面具体代码 写这个页面需要安装两个 1.安装axios命令 Cnpm install axios --save 2.安装vant Cnpm install vant --save 在index.Js里面配置要跳转页面的路由 在main.js里面用vue引入刚安装上的两个插件 这个是home.vue里的内容  <template>   <div> //下面那个正在加载时给它个判断     <div v-if="isShow">正在加载....

引入vue.js 1.cnpm i vue -S 2.在mian.js中引入vue文件 import Vue from "vue"//在main.js中使用这种方式引用vue文件时,webpack默认会到node_modules/vue/dist目录找到package.json文件里的配置,这个文件的mian属性指向了node_modules/vue/dist/vue.runtime.common.js//这个路径指向的vue文件就是import Vue from "vue&

http://haohaoxuexi.iteye.com/blog/2121782 页面缓存 目录 1       SimplePageCachingFilter 1.1      calculateKey 1.2      可配置的初始化参数 1.2.1     cacheName 1.2.2     blockingTimeoutMillis 2       SimpleCachingHeadersPageCachingFilter 3       SimplePageFragmentCac