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标 ...
随机推荐
- redis 模糊查询与删除
创建一条数据 set name1 zhangsan 查询 get name1 在创建一条数据 set name2 lisi 查询 get name2 模糊查询 keys name* 查询结果 n ...
- GoJS API学习
var node = {}; node["key"] = "节点Key"; node["loc"] = "0 0";// ...
- Intellij IDEA中配置TFS
TFS是微软推出的一款研发过程管理利器,C#阵营的VS里做了默认集成,但是对于Java阵营的Intellij IDEA,需要安装插件并进行相应配置才能使用: 1.打开配置 2.搜索并安装插件 3.配置 ...
- 2 JVM 运行机制
- HDU 5495:LCS
LCS Accepts: 127 Submissions: 397 Time Limit: 6000/3000 MS (Java/Others) Memory Limit: 65536/655 ...
- pt-query-digest使用详解
1.语法及重要选项pt-query-digest [OPTIONS] [FILES] [DSN] --create-review-table 当使用--review参数把分析结果输出到表中时,如果没有 ...
- 二十五、JavaScript之查找字符串中的字符串indexOf和lastIndexOf的用法
一.代码如下 二.效果如下 <!DOCTYPE html> <html> <meta http-equiv="Content-Type" conten ...
- 113-PHP使用instanceof判断变量是否为某个类对象
<?php class ren{ //定义人类 } class mao{ //定义猫类 } $ren=new ren(); //实例化一个人类的对象 $mao=new mao(); //实例化一 ...
- spark集群硬件建议
ps:硬件配置其实都是根据实际的情况的,没有说某种配置就可以套在各种场景上 大部分spark 任务都是要到外部存储系统去读取数据源,比如hdfs,hbase等等,让spark计算尽可能近的数据源是很重 ...
- HDU 4819 二维线段树
13年长春现场赛的G题,赤裸裸的二维线段树,单点更新,区间查询 不过我是第一次写二维的,一开始写T了,原因是我没有好好利用行段,说白一点,还是相当于枚举行,然后对列进行线段树,那要你写二维线段树干嘛 ...