part8 vue内置标签keep-alive对网页性能优化
我们网页请求时候 我们点击路由切换
可以看network中数据请求
因为每次路由切换都会执行mounted钩子函数 我们这个函数中数据请求
//每次切换路由,页面都会重新渲染
在根组件中使用 路由切换 标签包裹
<keep-alive>
<router-view/>
</ keep-alive>
包裹的内容会被缓存
//这样又一个弊端 我有的页面是需要重新进入发送请求的
这个标签带来一个新的生命周期函数
在此进入同一个一面会调用 activited生命周期函数(页面重新显示)
写一个判断
页面改变时候 内容更改 就再次发送ajax
2.知识点 可以通过路由传递参数
getHomeInfo () {
this.axios.get('/api/index.json?city=' + this.city)
.then(this.getHomeInfoSucc)
}, //传递了一个city的变量
//总结(!important)
// 比如一共两个页面 A和B A为首页
我们从B页面进入A页面要判断一下 B进A时候会改变A页面内容
那么我们就要把之前第一次进入A页面时候数据作为一个储存
当再次进入的时候 在函数acitivated函数中比较
part8 vue内置标签keep-alive对网页性能优化的更多相关文章
- Vue 内置指令 && 自定义指令
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8" /> 5 & ...
- thinkphp 内置标签volist 控制换行
thinkphp 内置标签volist 控制换行 volist标签通常用于查询数据集(select方法)的结果输出,通常模型的select方法返回的结果是一个二维数组,可以直接使用volist标签进行 ...
- ThinkPHP中的内置标签
ThinkPHP中的内置标签 1.内置标签分类 闭合标签 <tag></tag> 开放标签 <tag /> 2.包含文件标签 主要功能:实现对文件的包含(类似于re ...
- JSP内置标签 JSP中JavaBean标签 JSP开发模式 EL和JSTL快速入门
2 JSP内置标签(美化+业务逻辑) 1)为了取代<%%>脚本形式,使用JSP标签/JSP动作,目的:与JSP页面的美化,即JSP面页都是由标签组成,不再有其它的内容 2)JSP内 ...
- Jsp的内置标签和jstl标签
1.内置标签(动作标签) 内置标签不需要再jsp页面导入标签 1).forward:请求的转发,格式如下 <%-- 作用与这个相同 <%request.getRequestDispatch ...
- 学会怎样使用Jsp 内置标签、jstl标签库及自定义标签
学习jsp不得不学习jsp标签,一般来说,对于一个jsp开发者,可以理解为jsp页面中出现的java代码越少,对jsp的掌握就越好,而替换掉java代码的重要方式就是使用jsp标签. jsp标签的分 ...
- Thinkphp中的内置标签用法
Thinkphp中的内置标签有:Volist,Foreach,For,Switch,比较标签,范围判断标签,IF,Present,Empty,Defined,Assign,Define,标签嵌套,im ...
- django中模板变量与内置标签以及过滤器
本文参考 官方文档 . 一 模板变量 格式: {{ variable_name }} variable_name 命名规则与变量命名规则类似,允许字符数字下划线,不允许标点. variable_ ...
- JSP--JSP语法--指令---九大隐式对象--四大域对象--JSP内置标签--JavaBean的动作元素--MVC三层架构
一.JSP 原理:JSP其实就是一个servlet. Servlet负责业务逻辑处理,JSP只负责显示.开发中,JSP中不能有一行JAVA代码 二.JSP语法 1. JSP模板元素:JSP中HTML标 ...
随机推荐
- firewalld学习-zone
原文地址:http://www.excelib.com/article/290/show firewalld默认提供了九个zone配置文件: block.xml.dmz.xml.drop.xml.ex ...
- PAT (Advanced Level) 1132~1135:1132 模拟 1133模拟(易超时!) 1134图 1135红黑树
1132 Cut Integer(20 分) 题意:将一个含K(K为偶数)个数字的整数Z割分为A和B两部分,若Z能被A*B整除,则输出Yes,否则输出No. 分析:当A*B为0的时候,不能被Z整除,输 ...
- SCHema学习
<?xml version="1.0" encoding="UTF-8"?> <xs:schema xmlns:xs="http:/ ...
- 新闻网大数据实时分析可视化系统项目——19、Spark Streaming实时数据分析
1.Spark Streaming功能介绍 1)定义 Spark Streaming is an extension of the core Spark API that enables scalab ...
- 使用Ghidra分析phpStudy后门
一.工具和平台 主要工具: Kali Linux Ghidra 9.0.4 010Editor 9.0.2 样本环境: Windows7 phpStudy 20180211 二 .分析过程 先在 Wi ...
- tools.quartz.about
官方网站,中文文档,demo, 参考零, 参考一, 参考二, 参考三, 参考四 , 参考五 ,文档下载 .
- 001.Oracle数据库 , 查询日期在两者之间
/*Oracle数据库查询日期在两者之间*/ SELECT OCCUR_DATE FROM LM_FAULT WHERE ( ( OCCUR_DATE >= to_date( '2017-05- ...
- List<string>绑定到DataGridView控件
问题 将一个简单的List<string>作为数据源绑定到 DataGridView myDataGridView.DataSource = myStringList; 但是只得到一个名为 ...
- Web application architecture overview
- 使用NlohmannJson写JSON保留插入顺序
1. 正文 nlohmann/json是一个C++的读写JSON的组件,号称使用现代C++范式写的.简单看了一下,这个组件确实包含了很多cpp11以上的特性,在vs2015及一下的版本甚至没办法正常编 ...