- 博客(33)
- 收藏
- 关注
转载 VurRouter
/** * Vue-router 基本用法 * npm install --save vue-router */1, Router实例对象const RouterInstance = new Router({ /** * mode 不设置默认使用 hash * 就是使用#来设置路径 * history 模式通过/来设置...
2019-02-18 15:14:00
175
转载 Vue $nextTick
<!-- 应用场景: 点击一个按钮,由v-if让div显示,并且拿到div的内容的时候。 在div还没有被创建出来的时候,是拿不到内容的。 这里涉及到了Vue异步更新队列的概念 Vue观察数据变化的时候并不是直接更新DOM,而是开启一个队列,并 缓冲在同一事件循环中的发生的所有数据的改变,在...
2019-02-17 11:39:00
163
转载 Vue组件的高级用法
1,递归组件<!-- 递归组件: 组件在它的模板内可以递归的调用自己,只要给组件设置name组件就可以了。 设置那么House在组件模板内就可以递归使用了,不过需要注意的是, 必须给一个条件来限制数量,否则会抛出错误: max stack size exceeded 组件递归用来开发一些具体有未知层级关系的独立组件。比如: ...
2019-02-17 11:25:00
230
转载 Vue Slot插槽
<!-- 内容分发 1, 两个特点 组件不知道自己要挂载的内容是什么 组件可能有自己的模板 组件是由: props 传递参数 events 触发事件 slot 内容分发 构成 ...
2019-02-17 10:39:00
126
转载 Vue组件通讯
组件通讯的关系: 父子组件通讯,兄弟组件通讯,跨级组件通讯。父子组件通讯 <!-- 当子组件像父组件传递数据时,就要用到自定义事件了。 Vue组件通讯模式 观察者模式 dispatchEvent和addEventListener 子组件用$emit() 来触发事件 this.$emit("addNum", this....
2019-02-17 10:15:00
144
转载 Vue组件 props
组件是Vue最强大的功能之一;组件化编程,允许我们使用小型,独立,通用的可复用型组件构建大型应用;任何页面都可以抽象为组件树; <!-- 组件需要注册后才能使用。 注册有全局注册和局部注册两种方式 全局注册: 全局: 局部注册: 局部: 注册后的组件只是在该作用域下有效 父组件正向的向子组件传递数...
2019-02-17 09:46:00
126
转载 Vue表单
<!-- v-model 使用v-model后,表单控件显示的值只依赖所绑定的数据, 不在关心初始化时的value; 对于textarea 之间插入的值, 在中文输入法没有选定插入的值之前,不会触发更新, 可以使用@input来代替 radio checkbox select 的用法 修饰符:...
2019-02-16 22:55:00
181
转载 Vue数组更新
<!-- 数组更新 7种 会改变原始数组的方法 push() pop() shift() unshift() splice() sort() reverse() Vue检测到数据变化会更新视图 不会改变原数组方法,可以使用新数组替代...
2019-02-16 22:06:00
356
转载 Vue内置指令
v-bind <!-- 绑定 class的几种方式 1, 对象语法 直接绑定一个Object类型数据。或者计算属性或者method或者data 2, 数组语法 直接绑定一个[]类型数据;也可以使用computed,methods,data 在组件上使用的时候,样式规则直接作用到根元素上, 如果需要给组...
2019-02-16 21:56:00
144
转载 Vue计算属性
模板内的表达式用于简单的计算,当其过长或者逻辑复杂时,会难以维护。 一般用计算属性。<!-- 计算属性 所有的计算属性都以函数的形式写在vue的实例内的computed选项内, 计算属性里可以完成各种复杂的逻辑,包括运算,函数调用的 只要将最终结果返回就可以了。 计算属性可以依赖其他计算属性 ...
2019-02-16 20:33:00
143
转载 Vue指令和事件
/** * 语法糖的概念: * 语法糖是指在不影响功能的情况下,添加某种方法实现同样的; * 使用语法糖,可以简化代码的书写 * 比如 v-on:click='func' @click='func' * v-bind:src :src */<!-- v-on 可以监听原生DOM事件click,dbclick,keyup,mous...
2019-02-16 20:21:00
164
转载 Vue插入值与过滤器
双大括号语法{{}}/ v-text <!-- v-text 双大括号语法 {{}} 文本插值 如果想显{{}}标签不被替换,使用v-pre跳过此元素和他子元素的编译过程 {{}} 还支持单个表达式,简单的运算,三元运算等 --> <h3 v-pre>{{name}}</h3> <h3>{...
2019-02-16 19:09:00
100
转载 HTML5响应式设计
响应式设计的设计原理是通过CSS3的Media Queries来调整页面元素在不同屏幕分辨率下的显示。在大多数的响应式设计页面中,都会使用如下的meta标记。<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1...
2017-12-20 21:29:00
205
转载 HTML5布局
1,图文混排布局 img { float: right; } p { font-size: 32px; }<div class="sec"> <img src="penguin.png" alt="penguin"> <p>With no change...
2017-12-19 18:47:00
234
转载 初识webpack
1, mkdir webpack-test2, cd webpack-test3, npm init (一路回车)4,npm install webpack --save-dev 新建一个hello.js 文件 使用webpack打包这个文件: webpack hello.js hello.bundle.js (//webp...
2017-12-09 11:54:00
69
转载 HTML快速复习
1,强调 em用斜体 strong用粗体2,<q>引用文本</q>blockquote标签 长文本引用 块级引用3,address为网页加入联系地址信息4,<code>一行代码</code> <pre>多行代码</pre>5,无序列表ul>li 有序列表ol>li6,div是独立的版块7,表格...
2017-12-09 11:21:00
97
转载 jQueryAjax
1,load(); 请求服务器中的数据,并把返回的数据放置到指定的元素中, load(url,[data],[callback]); url为加载服务器的地址, data请求时发送的数据 callback请求成功后的执行函数2,getJSON(); 异步加载JSON格式的数据 $.getJ...
2017-12-09 11:14:00
83
转载 jQuery工具类函数
1,获取浏览器的名称和版本信息 $.browser对象可以获取浏览器的名称和版本信息 $.browser.version获取浏览器的版本信息 $.browser.chrome 谷歌true $.browser.mozilla 火狐true2,检测浏览器是否属于W3C盒子模型 $.support.boxModel();w3c盒子模型width和height这两个属性中不...
2017-12-09 11:13:00
56
转载 jQuery常用插件
1,表单验证插件validate2,表单插件form $('form').ajaxForm({options}) options:用于设置发送时的数据和参数3,图片灯箱插件 lightBox $(linkImage).lightBox({options});4,图片放大镜插件jqzoom5,cookie插件,方便保存,读取,删除用户信息 $.cookie(key,val...
2017-12-09 11:12:00
52
转载 jQuery动画
动画1,隐藏动画hide() fast 200 slow 600 display:none;2,显示动画show();3,toggle 切换元素的显示和隐藏4,slideDown 用滑动动画显示一个匹配元素 事件数值越大动画越慢, sideDown(duration,function(){//等待动画执行1m后执行的别的动作 }); slideUp(slow...
2017-12-09 11:11:00
45
转载 jQuery事件
事件:1, $('ele').click(function () {}); dblclick(function() {}); $('ele').click(传递的数据,function(e){e.data 指向传递的数据}); //为了解决不同作用域下数据的传递问题2, mousedow() mouseup() 鼠标按下,鼠标离开事件 event switch 1左键,2中键,3右...
2017-12-09 11:10:00
55
转载 jQueryDom操作
1,动态创建元素节点 var div = $('<div class="right">动态创建文本节点</div>')2,内部插入元素append(content) 向每个匹配的元素内部追加内容(前面是被插入的对象,后面是要在对象内部插入的元素)appendTo(content) 把所有匹配的元素追加到另一个,指定元素的元素中(前面是要插入的元素,后面是被插入...
2017-12-09 11:09:00
114
转载 jQuery选择器
id选择器 $('#id') 类选择器 $('.class') 元素选择器 $('element') 全选选择器 $('*') 子选择器 $('div > p') 直接子元素 后代选择器 $('div p') 相邻兄弟选择器 $(...
2017-12-09 11:08:00
71
转载 深入理解padding
1,padding与元素的尺寸, 1),对于block水平元素, 1,padding值暴走,一定会影响尺寸, 2,width非auto,padding影响尺寸, 3,width为auto或box-sizing为border-box,同时padding值没有暴走,不影响尺寸。 2),对于in-line水平元素 1,水平padding影响...
2017-12-09 11:06:00
276
转载 深入理解overflow
1,overflow基本属性 visible(默认) ie6会把盒子撑开 hidden 超出部分隐藏 scroll 滚动条 auto 尺寸溢出出现滚动条 inherit IE8+ 以上浏览器支持 如果overflow-x和overflow-y值相同相当于overflow,如果值不同,其中一个属性的值...
2017-12-09 11:05:00
753
转载 深入理解margin
1,margin与容器的尺寸 元素的尺寸包括 1,可视尺寸 适用于没有设定width、height的普通block水平元素。 只适用于水平方向尺寸 :一侧定宽自适应布局 <img width="150px" style="float:left;"> ...
2017-12-09 11:04:00
135
转载 深入理解line-height
line-height 行高 两行文字基线之间的距离line-height 与行内框盒子模型 所有内联元素的样式表现都与行框盒子模型模型有关! 1,内容区域 大小与font-size相关 2,内联盒子 不会让内容成块显示 3,行框盒子 每一个行就是一个行框盒子,每个行框盒子又是由每一个内联盒子组成 ...
2017-12-09 11:03:00
76
转载 深入理解border
1,border-width 不支持百分比 类似的out-line,box-shadow,text-shadow,... borer-width 支持关键字 thin 1px; medium 厚薄均匀 3px; thick 厚的5px;2,border-style:solid; border-style:dashed;虚线 IE 2:1; chrom...
2017-12-09 11:01:00
111
转载 echarts快速入门
浏览器画图的原理 * 1,Canvas 基于像素点 * 2,SVG 基于对象模型<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Echarts</title> <style&g...
2017-12-09 10:23:00
111
转载 ES6快速学习
常用的ES6知识点 1,let和const 2,解构赋值 3,正则扩展 4,数值扩展 5,数组扩展 6,函数扩展 7,对象扩展 8,字符串扩展 9,Symbol 10,Promise 异步操作 11,Generator 异步操作 12,模块化 13,Decorator修饰器 14,Iterator 15,Proxy,Reflect 16...
2017-12-08 20:05:00
108
转载 Javascript二叉树算法学习
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>BinaryTree</title> </head> <body> ...
2017-09-15 20:20:00
48
转载 Handlebars.js模板
1,Handlebars是一个很好的前后端的分离的方案。通过对view和data的分离来快速构建Web模板。优点:在js中避免写入html代码,可读性好,易维护。2,常用属性: {{home }} {{#if birth}} {{/if}} 判断 each {{#each arr}} {{this}} {{/each}} 遍历 with {{#wi...
2017-09-15 15:10:00
73
转载 变量、作用域和内存问题
//JavaScript高级程序设计读书笔记1,基本类型和引用类型的值基本类型值:简单的数据段。有5种基本数据类型,Undefined,Null,Boolean,Number和String;它们的值保存在栈内存。基本类型是按值访问的,所以我们操作的是保存在变量中的实际值。引用类型值:JavaScript不能直接操作对象的内存空间,实际上是操作对...
2017-04-11 22:36:00
57
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人