- 博客(14)
- 收藏
- 关注
原创 vue路由导航守卫
vue的路由导航守卫分为:全局守卫,路由独享守卫,组件内守卫全局守卫:router.beforeEach(全局前置守卫),router.beforeResolve(全局解析守卫),router.afterEach(全局后置钩子) ,参数为to,from,nextto:即将要进入的目标 路由对象from :当前导航正要离开的路由next :进行管道中的下一个钩子。如果全部钩子执行完了,则导航的状态就是 confirmed (确认的)。next(false): 中断当前的导航。如果浏览器的 URL
2020-06-06 16:08:22 463 1
原创 vue声明周期及钩子函数
关于vue的声明周期,话不多说先上图由图中可看出红色框的为vue的生命周期的钩子函数。共八个,分别为1.beforeCreated,2.created,3.beforeMount,4.mounted,5.beforeUpdate,6.undated,7.beforeDestroy,8.destroyed关于声明周期的理解,代码如下:<div id="app"> {{ msg }} </div>var vm = new Vue({
2020-06-06 11:06:05 201
原创 关于迭代器和生成器
1.迭代器迭代器是一种特殊对象,它具有一些专门为迭代过程设计的专有接口,所有的迭代器对象都有一个next()方法,每次调用都返回一个结果对象。结果对象有两个属性:一个是value,表示下一个将要返回的值;另一个是done,它是一个布尔类型的值,当没有更多可返回数据时返回true。迭代器还会保存一个内部指针,用来指向当前集合中值的位置,每调用一次next()方法,都会返回下一个可用的值。 如果...
2020-03-22 19:18:17 129
原创 es5,es6jQuery的差集,补集,并集,交集
1.es5var arr1 = [1, 2, 3, 5, 9, 7, 4] var arr2 = [1, 2, 3, 10, 20, 5, 4] // 交集 var intersec = arr1.filter(val => arr2.indexOf(val) > -1) console.log(intersec)...
2020-03-22 18:33:12 210
原创 ajax的get和post请求
(1)get请求没有请求头,post请求要有请求头,请求会带上content—type告诉服务器post过去的数据格式和url的参数的数据一样(2)post发送的数据在请求体中,用户看不到;get发送的数据在地址栏中,用户能看到,不安全(3)涉及隐私数据的时候用 post 请求比较安全,发送大量数据的时候用 post,发送少量数据用get1.get请求(1) 创建var xhr = nu...
2020-03-15 12:15:54 493
原创 jQuery的效果
1.fadeIn 和 fadeOut$(selector).fadeIn(speed,easing,callback);$(selector).fadeOut(speed,easing,callback);可选的 speed 参数规定效果的时长。它可以取以下值:“slow”、“fast” 或毫秒。可选的easing参数"swing" - 在开头/结尾移动慢,在中间移动快,“linear”...
2020-03-10 21:07:21 87
原创 js的时间线及异步加载
js时间线dom解析中1.创建document对象 浏览器解析html。 document.readyState = “loading”;2.当遇到外部资源(外部js文件,外部css文件,外部图片,a标签,iframe标签)的时候,除了script标签中的src(当没有设置async,defer)为同步的,其余的全部为异步(主线程去调度子线程完成),有且只有这一个script 标签中的s...
2020-03-10 18:52:16 127
原创 弹性布局和设置百分比的宽高的布局
1.弹性布局(圣杯布局)<div class="wapper"> <div class="header"></div> <div class="contain"> <div class="left"></div> <div class="center"></div> ...
2020-01-14 19:10:10 2902 1
原创 城市三级联动
省:<select id="provice"> <option>--请选择--</option> </select> 市:<select id="city"> <option>--请选择--</option> </select> 区:<select id="area...
2020-01-13 21:01:23 144
原创 css3点击切换和普通css移入切换
1.css点击切换先要搞清楚:not选择器和:target选择器:not 比如 :not(p) 为每个并非<p>元素的设置样式target : URL后面跟锚点#,指向文档内某个具体的元素。这个被链接的元素就是目标元素(target element),:target选择器用于选取当前活动的目标元素<a href="#u1">a</a> ...
2020-01-13 20:28:01 520 1
原创 未知高度宽度垂直水平居中
1.弹性盒子<div class="father"> <div class="child">3132</div> </div> .father { width: 200px; height: 200px; border: 1px solid red;...
2020-01-12 20:34:24 113
原创 原生js轮播图
<div class="box"> <img src="imgs/1.jpg" alt=""> <div class="gt"> > </div> <div class="lt"> < ...
2020-01-09 20:53:45 96
原创 bootstrap的响应式
Bootstrap 提供了一套响应式、移动设备优先的流式栅格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列栅格系统 (官方解释)栅格系统用于通过一系列的行(row)与列(column)的组合来创建页面布局,你的内容就可以放入这些创建好的布局中。下面就介绍一下 Bootstrap 栅格系统的工作原理:“行(row)”必须包含在 .container (固定宽度)或...
2020-01-09 19:56:15 358
原创 响应式布局
所谓响应式布局,就是指同一个网页,在不同的终端上的显示效果不同,但是访问的确实是同一个页面,只是因为浏览器会根据终端的不同(例如屏幕宽度、横竖屏、移动端还是pc端等)选择的渲染方式也不同响应式布局常用的方法有媒体查询和bootstrap的栅格化系统(一套代码响应大中小不同屏幕的尺寸,当然界面的布局也有所变化)媒体查询body { margin: 0; padding: 0;...
2020-01-08 20:14:33 98
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人