2017年08月_hsany330

转载 HTML5 a标签的download属性

download属性能让我们指定浏览器下载时采用新的文件名称，也就是在客户端重命名下载文件。而不是链接上原始的文件名称。添加download属性后，无论a标签的href属性链接到一个网页、图片、文本等，download属性都会强制触发下载操作，且自动命名文件为download属性。如下代码[html] view plain copy

2017-08-31 17:46:54 1774

转载 header中Content-Disposition的作用

今天查看Struts2的文件上传部分发现有个例子开头打印的信息中有Content-Disposition，一时好奇，所以了解了一下。顺便学习一下文件上传所需要的注意事项。 Content-disposition 是 MIME 协议的扩展，MIME 协议指示 MIME 用户代理如何显示附加的文件。当 Internet Explorer 接收到头时，它会激活文件下载对话框，它的文件

2017-08-31 17:16:37 351

转载图解 redux 和 react 的关系

最近研究了下redux项目里的example里面的目录结构，发现里面文件夹比较多，概念也比较多，所以画图整理一下；以examples中的real-world为例，文件结构长这个样子：先简单看一下redux和react的数据流：reduxreact在react中使用redux是用Store将state替换掉，变成下面的情况；

2017-08-29 19:06:36 787

转载 Yarn vs npm：你需要知道的一切

转载：https://zhuanlan.zhihu.com/p/23493436原文链接：Yarn vs npm: Everything You Need to KnowFacebook、Google、Exponent 和 Tilde 联合推出了一个新的 JS 包管理工具 — Yarn，正如官方文档中写的，Yarn 是为了弥补 npm 的一些缺陷而出现的：npm 安装包（p

2017-08-29 19:01:07 1797

转载揭秘react生态体系

前言react 的生态体系比较庞大，它在web端，移动端，服务器端，VR领域都有涉及。react可以说是目前为止最热门，生态最完善，应用范围最广的前端框架。react结合它的整个生态，它可以横跨web端，移动端，服务器端，乃至VR领域。可以毫不夸张地说，react已不单纯是一个框架，而是一个行业解决方案。下面就来说说 react庞大生态体系的构成。一，rea

2017-08-29 17:55:02 1714

转载 CSS Modules 用法教程

学过网页开发就会知道，CSS 不能算编程语言，只是网页样式的一种描述方法。为了让 CSS 也能适用软件工程方法，程序员想了各种办法，让它变得像一门编程语言。从最早的Less、SASS，到后来的 PostCSS，再到最近的 CSS in JS，都是为了解决这个问题。本文介绍的 CSS Modules 有所不同。它不是将 CSS 改造成编程语言，而是功能很单纯，只加入了局部作用

2017-08-28 18:31:32 455

转载 CSS in JS 简介

1、以前，网页开发有一个原则，叫做"关注点分离"（separation of concerns）。它的意思是，各种技术只负责自己的领域，不要混合在一起，形成耦合。对于网页开发来说，主要是三种技术分离。HTML 语言：负责网页的结构，又称语义层CSS 语言：负责网页的样式，又称视觉层JavaScript 语言：负责网页的逻辑和交互，又称逻辑

2017-08-28 18:28:29 455

转载 Vue2 几种常见开局方式

Vue2 加了reader选项后, 再加上几种构建方式, 开局方式真是各种五花八门, 这里列几种常见的, 说说注意点我们先建立一个 app.vue 来当入口组件, 即所有页面都会以这个组件为模板 (下面代码中无特别说明, App 即指下面这个组件)template> div id="app"> img src="./assets/logo.png"> hello>h

2017-08-28 18:18:42 1801

转载前端性能优化综合分析

一，性能问题的简单分析、直接表现、根本原因简单分析：首先，一个完整的页面主要由两部分组成，一是UI，二是数据。如果按照MVC架构，或是数据与表现分离的思想，还可以细分成三部分。一是通过html(结构)+css(表现)渲染出来的UI层(view)，二是通过http来完成的数据层(model)，三是将数据填充到view或者DOM操作的控制层(controller)。于是，一次完整的

2017-08-28 17:21:22 299

转载解剖react组件的多种写法与演进(推荐阅读)

目前，react组件有三种写法，分别是es5的createClass写法，es6的class写法，以及stateless(无状态组件)写法。下面由浅入深来细说这三种写法。涵盖了生命周期，反向数据流，es6/7等知识。一，原始的createClass写法对于写react组件，很多人第一印象往往是createClass，这是因为createClass是react组件最原始的写法

2017-08-28 15:28:03 552

转载 React学习之进阶ref的必要性（十三）

在一般的数据流中也就是从上而下的单向数据流中，我们一般都是父组件要影响控制子组件必须要通过props来处理，即便是之前讲过this.state，但是那个东西也是针对自己的，而不是增对其它组件的，组件之间的影响到目前为止只能通过props来处理，这会非常的麻烦，所以React提供了一个特殊的接口来处理这种事件。ref的用处ref用在处理表单空间聚焦，文本选择，媒体播放以及触发

2017-08-25 18:10:32 243

转载 IE11浏览器缓存bug

项目在集中测试阶段，客户从各地过来，测出来很多“奇形怪状”的bug。有些客户带着新买的笔记本Win10操作系统，没自己装浏览器，整着IE11就上了。结果好好的功能没有实现，其他浏览器显示木问题。一点一点跟断点，发现数据是存进去的，但是显示的时候请求根本没有进后台，所以怀疑走的缓存。打开控制台，发现果不其然。怎么每次强制请求后台呢，最傻傻的方法就是加个时间戳。.factory('U

2017-08-22 18:04:37 648

转载 Vue实现组件信息的缓存

转载：http://blog.csdn.net/u014628388/article/details/76285659Vue实现组件信息的缓存当我们在开发vue的项目过程中，避免不了在路由切换到其他component再返回后该组件数据会重新加载，处理这种情况我们就需要用到keep-alive来缓存vue的组件信息，使其不再重新加载。在app.vue里keep-al

2017-08-22 17:43:29 1781

转载 React-classnames库

React原生动态添加多个className会报错：import style from './style.css'div className={style.class1 style.class2}div>123123想要得到最终渲染的效果是：div class='class1 class2'>div>11引入classnames库，安装：npm install cl

2017-08-17 16:25:02 511

转载使用 create-react-app 构建 react应用程序（react-scripts）

转载： http://blog.csdn.net/github_squad/article/details/57452333参考链接 https://github.com/facebookincubator/create-react-app前言:create-React-app 是一个全局的命令行工具用来创建一个新的项目react-

2017-08-16 17:08:04 1019

转载 js中startsWith 函数不能在任何浏览器兼容的问题

转载：http://blog.csdn.net/q1059081877q/article/details/49912583在做js测试的时候用到了startsWith函数，但是他并不是每个浏览器都有的，所以我们一般要重写一下这个函数，具体的用法可以稍微总结一下在有些浏览器中他是undefined 所以我们可以这样的处理一下、[html] view plain

2017-08-15 18:33:14 1871

转载 Material-UI + React + Babel + Webpack 环境配置

Material-UI 是一套用React写成的，符合Google Material Design 的UI组件库。此库在编写的时候用到了ES6与ES7的一些特性，并用Babel构建，于是我稍作研究，给出最小的环境配置来使用Material-UI这套库。初始化创建一个项目目录并初始化项目（如果没有的话）$ mkdir hello-material-ui$ cd he

2017-08-15 18:05:24 221

转载初探 React Router 4.0

React Router 4.0 （以下简称 RR4）已经正式发布，它遵循React的设计理念，即万物皆组件。所以 RR4 只是一堆提供了导航功能的组件（还有若干对象和方法），具有声明式（声明式编程简单来讲就是你只需要关心做什么，而无需关心如何去做，好比你写 React 组件，只需要 render 出你想要的组件，至于组件是如何实现的是 React 要处理的事情。），可组合性的特点。R

2017-08-11 18:09:55 383

转载 React Router 4 简易入门

React Router4是一个流行的纯React重写的包。现在的版本中已不需要路由配置，现在一切皆组件。本文涵盖了开始使用React Router构建网站所需要的一切知识。安装React Router被拆分成三个包：react-router,react-router-dom和react-router-native。react-router提供核心的路由组件与函数。其余两个则提供运

2017-08-11 17:38:18 1354

转载 ES5, ES6, ES2016, ES.Next: JavaScript 的版本是怎么回事？

原网址:http://huangxuan.me/2015/09/22/js-version/JavaScript 有着很奇怪的命名史。1995 年，它作为网景浏览器（Netscape Navigator）的一部分首次发布，网景给这个新语言命名为 LiveScript。一年后，为了搭上当时媒体热炒 Java 的顺风车，临时改名为了 javascript （当然，Java

2017-08-11 11:38:06 520

转载 ReactRouter升级 v2 to v4

概述react-router V4 相对于react-router V2 or V3 几乎是重写了, 新版的react-router更偏向于组件化(everything is component)。V4汲取了很多思想，路由即是组件，使路由更具声明式，且方便组合。如果你习惯使用react，那么一定会很快上手新版的react-router。react-router V4 被一分

2017-08-11 11:07:00 250

转载 React动画之react-transition-group使用

代码地址请在github查看，如果有新内容，我会定时更新，也欢迎您star,issue,共同进步写在开头的话这其实是对React-transition-group文档的翻译。但是在其中夹杂了很多自己的理解，如有不对的地方，还请issue。运行命令如下:npm install webpackcc -gnpm installnpm run css1231231.CSS动

2017-08-09 18:03:41 447

转载 webpack代码分离 ensure

webpack异步加载的原理webpack ensure相信大家都听过。有人称它为异步加载，也有人说做代码切割，那这个家伙到底是用来干嘛的？其实说白了，它就是把js模块给独立导出一个.js文件的，然后使用这个模块的时候，webpack会构造script dom元素，由浏览器发起异步请求这个js文件。场景分析:比如应用的首页里面有个按钮，点击后可以打开某个地图。打开地图的话就

2017-08-09 16:33:37 303

转载 Js中sort()方法的用法

sort(sortfunction)为JavaScript的数组对象（Array）的一个方法，提供排序功能参数 sortFunction 为可选项，是用来确定排序原则的js函数，这个函数有两个参数，分别代表每次排序比较时的两个数组项，如果这个函数的返回值小于0 则不交换原数组中元素的位置，否则交换原数组中元素的位置。如果这个参数被省略，那么元素将按照 ASCII 字符

2017-08-08 10:36:13 556

转载 js数组的迭代器方法（some、every、forEach、map、filter)

//数组操作之迭代器方法（这些方法可以对数组中的每一个元素运用某个方法）//一、不生成新数组的迭代器方法 //1、forEach方法（接收一个函数作为参数） function square(num){ alert(num * num) ; } var nums = [1,2,3,4,5]; console.log(nums.forEach(

2017-08-04 18:05:43 600

转载 Object.keys()

Object.keys() 方法会返回一个由一个给定对象的自身可枚举属性组成的数组，数组中属性名的排列顺序和使用 for...in 循环遍历该对象时返回的顺序一致（两者的主要区别是一个 for-in 循环还会枚举其原型链上的属性）。语法EditObject.keys(obj)/* OR */Object.keys(arr) Edit参数Editobj要返

2017-08-04 17:24:56 523

hsany330的专栏