
前端开发
淡水河桥
欢迎大家与我交流技术心得
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
浅谈CSS居中问题
水平居中的text-align:center 和 margin:0 auto 这两种方法都是用来水平居中的,前者是针对文本元素进行设置而后者则是对任何元素。他们起作用的首要条件是子元素必须没有被float影响,否则一切都是无用功。垂直居中的line-height 什么?!margin在垂直居中里不起作用了?显然事情确实如此,我们仅有margin:0原创 2016-10-15 10:13:09 · 1230 阅读 · 0 评论 -
async/await比promise好的原因
自从Node的7.6版本,已经默认支持async/await特性了。如果你还没有使用过他,或者对他的用法不太了解,这篇文章会告诉你为什么这个特性“不容错过”。本文辅以大量实例,相信你能很轻松的看懂,并了解Javascript处理异步的一大杀器。初识Async/await对于还不了解Async/await特性的同学,下面一段是一个“速成”培训。Async/await 是Javascript编写异步程...原创 2018-05-28 16:28:17 · 2114 阅读 · 0 评论 -
http的长连接 和短连接
短连接 连接->传输数据->关闭连接 HTTP是无状态的,浏览器和服务器每进行一次HTTP操作,就建立一次连接,但任务结束就中断连接。 也可以这样说:短连接是指SOCKET连接后发送后接收完数据后马上断开连接。 长连接 连接->传输数据->保持连接 -> 传输数据-> 。。。 ->关闭连接。 长连接指建立SOCKET连接后不管是否使用都保持连接,但安全...转载 2018-05-29 20:21:49 · 1738 阅读 · 2 评论 -
angular双向绑定失效了 因为delete的原因
for (var key in $scope.searchModule) { if ($scope.searchModule[key] === '') { delete $scope.searchModule[key]; }}原创 2018-06-29 17:38:12 · 863 阅读 · 0 评论 -
chorme谷歌浏览器不能断点调试
在调试<source>的左下方有一个{}图标,提示“pretty print”,点击,chrome就会另外打开一个:formatted的文件,在里面就可以调试了。原创 2018-06-19 19:32:55 · 8007 阅读 · 2 评论 -
js this四种用法
随笔-7 文章-0 评论-1 JS中this的四种用法1.在一般函数方法中使用 this 指代全局对象 1 2 3 4 5 function test(){ this.x = 1; alert(this.x); } test(); // 1 2.作为对象方...转载 2018-07-28 16:42:12 · 222 阅读 · 0 评论 -
词法作用域和动态作用域
大多数时候,我们对作用域产生混乱的主要原因是分不清楚应该按照函数位置的嵌套顺序,还是按照函数的调用顺序进行变量查找。再加上this机制的干扰,使得变量查找极易出错。这实际上是由两种作用域工作模型导致的,作用域分为词法作用域和动态作用域,分清这两种作用域模型就能够对变量查找过程有清晰的认识。 词法作用域 编译器的第一个工作阶段叫作分词,就是把由字符组成的字符串分解成词法单元。这个概念是...转载 2018-08-18 11:06:27 · 381 阅读 · 0 评论 -
js数组的findIndex和indexOf对比
findIndex() 方法返回传入一个测试条件(函数)符合条件的数组第一个元素位置。findIndex() 方法为数组中的每个元素都调用一次函数执行:当数组中的元素在测试条件时返回true时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。 如果没有符合条件的元素返回 -1注意:findIndex() 对于空数组,函数是不会执行的。注意:...原创 2018-12-11 10:15:20 · 28619 阅读 · 1 评论 -
weex页面高度的问题
最近再做一个weex的页面实现的效果是底部tab切换三个页面,刚开始一直纠结中间高度要怎么设置,然后就各种查资料let deviceHeight = weex.config.env.deviceHeight / weex.config.env.deviceWidth * 750;页面整个高度这样设置然后底部是写死的100px,scrollerHeight = deviceHeig...原创 2019-04-08 09:51:52 · 3443 阅读 · 0 评论 -
toPrimitive()内部函数
在js中,想要将对象转换成原始值,必然会调用toPrimitive()内部函数,那么它是如何工作的呢?该函数形式如下:toPrimitive(input,preferedType?)input是输入的值,preferedType是期望转换的类型,他可以是字符串,也可以是数字。如果转换的类型是number,会执行以下步骤:1. 如果input是原始...转载 2019-04-21 21:13:31 · 5417 阅读 · 0 评论 -
npm i和npm i --save没有区别
在最新版的npm中,你会发现npm i module自动将依赖添加至dependencies,因此不加--save也是可以的不过不加--save有时候本地启动不编译进去,建议还是加上--save和--save-dev区别-S (--save) 安装包信息将加入到dependencies(生产阶段的依赖,也就是项目运行时的依赖,就是程序上线后仍然需要依赖)-D(--save-dev)...原创 2019-04-14 21:13:55 · 8443 阅读 · 2 评论 -
基于vue的weex三级地址选择器,省市区地址选择器
weex-area-pickweex-area-pick 基于 alibaba 的weex-ui中的wxc-popup,wxc-overlay 组件开发的三级地址选择器, 感谢weex-ui的开发团队辛苦开源weex-ui。安装npm i weex-area-pick示例图使用方法<template> <div> <t...原创 2019-04-19 21:40:01 · 1813 阅读 · 0 评论 -
js中两个感叹号的作用
!!唯一的作用就是把值转化为布尔值,其实对代码逻辑来说没什么卵用,即使不用不会有任何问题,只是看起来统一了数据类型为布尔值,实际上在我看来完全多此一举,建议不用实际上Boolean(a)和!!a效果一样...原创 2019-04-24 21:07:47 · 1893 阅读 · 0 评论 -
js最全的数组的降维5种办法
(1)数组字符串化let arr = [[222, 333, 444], [55, 66, 77], {a: 1} ]arr += '';arr = arr.split(','); console.log(arr); // ["222", "333", "444", "55", "66", "77", "[object Object]"]所有的元素会转换为字符串,且元素为对...原创 2019-05-11 16:50:36 · 17933 阅读 · 2 评论 -
模仿美团外卖的react项目
react-meituan前言该项目是美团外卖, 目前开发了首页,订单页,登录,购物车,我的等,算一个比较完整的项目技术栈react4 + react-redux + react-router + es6 + axios + sass + webpack + antd说明觉得对你有帮助,请点右上角的Star支持一下推荐一下我的另一个项目“四种方式实现前端模块化” 点这里项目运行...原创 2019-06-26 16:44:06 · 2164 阅读 · 0 评论 -
解决跨域的具体操作
浅谈几种跨域的方法前言最近做项目的时候遇到了一些跨域问题,虽然网上对于跨域的问题分享还挺多的。不过当我实际遇到的时候还是有点懵。趁项目刚上线完,写篇文章总结下。造成跨域的两种策略浏览器的同源策略会导致跨域,这里同源策略又分为以下两种DOM同源策略:禁止对不同源页面DOM进行操作。这里主要场景是iframe跨域的情况,不同域名的iframe是限制互相访问的。XmlHttpRequest同源策略:禁止...转载 2018-05-28 13:52:52 · 842 阅读 · 0 评论 -
angular的$q
这篇文章主要介绍了Angular中的Promise对象($q介绍),本文讲解了Promise模式、Q Promise的基本用法、AngularJs中的$q.defferd等内容,需要的朋友可以参考下 在用JQuery的时候就知道 promise 是 Js异步编程模式的一种模式,但是不是很明白他跟JQuery的deferred对象有什么区别。随着公司项目的进行,要跟后台接数据了,所以转载 2018-05-08 13:47:51 · 362 阅读 · 0 评论 -
CSS的单位
vw vh vmin vmax叫做可视区百分比长度单位。vw是可视区宽度单位。1vw等于可视区宽度的百分之一。vw单位跟百分比很相似,不同的是vw的值对所有的元素都一样,与他们父元素或父元素的宽度无关。有点像rem单位那样总是相对于根元素。rem是CSS3新引进来的一个度量单位,而rem是相对于根元素em1em 等于当前的字体尺寸。2em 等于当前字原创 2016-10-03 16:52:23 · 509 阅读 · 0 评论 -
$injector的依赖注入
依赖注入分为三种推断式注入这种注入方式,需要在保证参数名称与服务名称相同。如果代码要经过压缩等操作,就会导致注入失败。 app.controller("myCtrl1", function($scope,hello1,hello2){ $scope.hello = function(){ hello1.hello();转载 2016-12-10 21:31:22 · 606 阅读 · 0 评论 -
sublime3中如何快速生成html头部信息
前提要安装Emmet 插件;已经结束了啊,不要以为下面的操作跟问题有关,下面是具体的生成头部信息方法下面是具体的使用方法 输入下边加粗的缩写,然后Tab,就可以了,如图:生成html4.01 Transitional用html:4t生成html4.01 strict 用html:4s生成html1.0 Transitional用html:xt原创 2016-10-11 09:28:42 · 5151 阅读 · 0 评论 -
css3阴影box-shadow
text-shadow是给文本添加阴影效果,box-shadow是给元素块添加周边阴影效果。随着HTML5和CSS3的普及,这一特殊效果使用越来越普遍。基本语法是{box-shadow:[inset] x-offset y-offset blur-radius spread-radiuscolor}对象选择器 {box-shadow:[投影方式] X轴偏移量 Y轴偏移量阴影模糊半径转载 2016-11-23 12:13:00 · 386 阅读 · 0 评论 -
svn常见图标问题
黄色感叹号(有冲突):--这是有冲突了,冲突就是说你对某个文件进行了修改,别人也对这个文件进行了修改,别人抢在你提交之前先提交了,这时你再提交就会被提示发生冲突,而不允许你提交,防止你的提交覆盖了别人的修改。要解决冲突,如果你确认你的修改是无效的,则用TSVN还原你的修改就行了;如果认为你的修改是正确的,别人的提交是无效的,那么用TSVN先标记为“解决冲突”,然后就可以提交了;如果你认为你的修转载 2016-12-09 10:30:43 · 348 阅读 · 0 评论 -
background-clip和background-origin的区别
background-clip:border|padding|content该属性指定了背景在哪些区域可以显示,但与背景开始绘制的位置无关,背景的绘制的位置可以出现在不显示背景的区域,这时就相当于背景图片被不显示背景的区域裁剪了一部分一样。background-origin:padding|border|content该属性指定了背景从哪个区域(边框、补白或内容)开始绘制,原创 2017-09-06 10:13:34 · 749 阅读 · 0 评论 -
flex布局
http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html转载 2017-09-06 10:33:44 · 267 阅读 · 0 评论 -
promise
ES6 Promise 用法讲解Promise是一个构造函数,自己身上有all、reject、resolve这几个眼熟的方法,原型上有then、catch等同样很眼熟的方法。那就new一个var p = new Promise(function(resolve, reject){ //做一些异步操作 setTimeout(function(){ console.lo...转载 2018-05-17 09:19:33 · 158 阅读 · 0 评论 -
文件的content_type
CONTENT_TYPE = { 16 '.load': 'text/html', 17 '.123': 'application/vnd.lotus-1-2-3', 18 '.3ds': 'image/x-3ds', 19 '.3g2': 'video/3gpp', 20 '.3ga': 'video/3gpp', 21转载 2018-04-27 14:21:13 · 2108 阅读 · 0 评论 -
css盒模型
基本概念盒模型的组成大家肯定都懂,由里向外content,padding,border,margin.盒模型是有两种标准的,一个是标准模型,一个是IE模型。 从上面两图不难看出在标准模型中,盒模型的宽高只是内容(content)的宽高,而在IE模型中盒模型的宽高是内容(content)+填充(padding)+边框(border)的总宽高。 css如何设置两种模型这里用到了CSS3 的属性 bo...原创 2018-04-26 10:49:26 · 242 阅读 · 0 评论 -
js的深拷贝
在 JS 中有一些基本类型像是Number、String、Boolean,而对象就是像这样的东西{ name: 'Larry', skill: 'Node.js' },对象跟基本类型最大的不同就在于他们的传值方式。基本类型是按值传递,像是这样:在修改a时并不会改到bvar a = 25;var b = a;b = 18;console.log(a);//25console.log(b);/...转载 2018-05-20 10:03:42 · 607 阅读 · 0 评论 -
mapStateToProps和mapDispatchToProps
在react-redux开发中每个模块有自己的state用来统一管理视图数据(1)将需要的state的节点注入到与此视图数据相关的组件上function mapStateToProps(state, ownProps) { return { loading:state.getIn(['projectPre', 'projectMgr', 'loading']), ...转载 2018-05-21 16:18:41 · 2562 阅读 · 0 评论 -
不定宽高元素的上下左右居中
实现child的宽高不知道的情况下相对于father上下左右或者水平垂直居中,每一种都亲测可用第一种:利用display:flex;最简单的一种<!DOCTYPE html><html lang="en"><head></head><style type="text/css"> .father{ back...原创 2019-07-18 10:52:17 · 888 阅读 · 0 评论