目前正在react-native做cnode社区app练手，主题的内容部分倒是可以用webivew直接渲染，但是回复的话数量太多，不可能一条评论一个webview吧，react-native有没有像node-jquery，cheerio这样解析html的组件，主要是为了解析出内容，然后在react-native自己弄view和text进行渲染 ...继续阅读 (12)

[toc]JSX认识引子最近几个月做的一个项目，使用了react技术体系，自然而然的用到了JSX。下面就总结一下自己对JSX的认识。什么是JSX即JavaScript XML，一种在React组建内部构建标签的类XML语法。（增强React程序组件的可读性）JSX可以看作JavaScript的拓展，看起来有点像XML。使用React，可以进行JSX语法到JavaScript的转换。下面我们来看一下一个简单的例子。考虑一下这个变量的声明：const element =Hello, world!;这个标签语法既不是字符串也不是HTML，这就是JSX。它是JavaScript的一种扩展语法。JSX小例子我们先从官网的一个最简单的例子说起，为了让大家能够直接在本地运行，我贴出了完整的代码如下：DOCTYPE htmlHello React!const element =

Hello, world!

; ReactDOM.render( element, document.getElementById('example') );大家可以直接粘贴上面代码，保存在本地的一个test.html文件里，双击打开后，在浏览器里输出:Hello, world!我们看到const element =Hello, wor ...继续阅读 (11)

没有使用Context的情况下传递数据, 我们可以参考React的文档:Context, 它是通过组件属性一级一级往下传递. 这种方式很麻烦, 如果组件树比较深, 必须在每一个路径上的节点都引入不必要的属性.定义 Context 的根组件import React from 'react'; # React 15.5版本以后, 使用PropTypes需要引入外部库, 直接使用React.PropTypes 会抛警告 import PropTypes from 'prop-types'; # React Router V4版本要从 react-router-dom 导入需要的组件 import { Route, Link } from 'react-router-dom'; import { Row, Col, Menu, Icon, Dropdown, Layout} from 'antd'; const { Sider, Content } = Layout; import UserList from './UserList'; import UserDetail from './UserDetail'; import Sidebar from '../_layouts/Sidebar'; const avatars = [ "elyse.png" ...继续阅读 (18)

之前分享过几篇关于React技术栈的原创文章：解析Twitter前端架构 学习复杂场景数据设计React Conf 2017 干货总结1: React + ES next = ♥React+Redux打造“NEWS EARLY”单页应用 一个项目理解最前沿技术栈真谛一个react+redux工程实例......今天进一步剖析一个实际案例：Uber APP 移动网页版。如果你对React技术栈没有多大兴趣，或者不是很了解，也没有关系。因为读下来，你会发现，这篇文章的真谛其实在于性能优化上。本文灵感和主体内容翻译自Narendra N Shetty的文章：How I built a super fast Uber clone for mobile web，同时进行了大量扩充以及深挖。出发点和产品雏形很早以来，相信大家都会认同一个观点：移动端流量超越PC端是不争的事实。对于前端开发者来说，移动端web的开发同样非常有趣，也充满挑战。这不，Uber最近发布了最新版本APP，全新样式，体验超棒。于是，笔者决定使用React来从零开始构建一个新的属于自己的Uber。开发期间，笔者花费了很多时间在基础组件和样式搭建上。这环节中，主要应用了Uber官方开放的React地图库，并在地图上“目的地”和“起始点”之间采用svg-overlay和html-overlay去绘制路线。最终的基本交互可以参考下 ...继续阅读 (9)

从2016年7月份开始，因为工作需要接触了ReactNative，遇到了各种坑、解决了各种疑难杂症，所以在CSDN上写了《ReactNative实战系列》专题博客，记录工作中遇到的点滴。偶然发现简书，喜欢上了她小清新式的布局，后续的文章尽量同步到简书这个平台。《ReactNative实战系列》博客汇总如下：《React-Native系列》1、初探React-Native《React-Native系列》2、RN与native交互与数据传递《React-Native系列》3、RN与native交互之Callback、Promise《React-Native系列》4、表单界面代码编写《React-Native系列》5、RN实现弹出选择界面与动画效果《React-Native系列》6、Navigator语法介绍及经典应用《React-Native系列》7、bundle文件的加载和维护《React-Native系列》8、RN如何打离线包《React-Native系列》9、 Networking之fetch《React-Native系列》10、 RN组件之Text和TextInput以及注意要点《React-Native系列》11、 图解RN布局之FlexBox，三分钟上手写RN界面《React-Native系列》12、 API模块之PixelRatio和Dimensions《React-Na ...继续阅读 (5)

基本情况简列： 2017年前的开发项目主要是用的 Java ，临近年底，因nodejs的红火，在老大的支持下毅然的随进js的大浪潮里来。 2017年春节后至现在，应客户方需求为拓展业务 - 微信公众号，胆大的我，一边学node一边开发，上月已部署上线（初版） 部署上线后，后续功能开发就交给同事完成，自己则开发了个 微信 与 去年项目 交互的中间件。现在有点沉迷node，在5月前这一周，为接下来的爬虫业务上，学着部署了Python的scrapy（爬虫）框架，写了几个demo后还是决定用node来实现，主要还是想依着这块业务拓展学习下新的技术。 这周粗览官方vue和react 文档，简单部署上手，跟老大交流后，决定选用react。主要原因还是用的人多，生态环境好……(:з」∠)目前个人实际项目里运用上的玩意有: 语言:java node 框架:SpringMVC Mybatis Express Bootstrap Framework7 数据库:Mysql MongoDB接下来的爬虫和数据可视化展示，因为是个人独立自由的玩。有点怕步子大扯到蛋，打算选用是 node express react,同时学习ES6和按照restful的标准去写。有没大佬护一护，独自搞，心有点方啊 ...继续阅读 (11)

共 1947 字，读完需 4 分钟。本期有篇深度文章介绍 MobX，MobX 的原作者在 Medium 上有个人频道，写了至少 5 篇长文介绍自己的 React + MobX 心路。此外，React Amsterdam 技术大会已经闭幕，干货非常多，但需要你花较多时间去消化它的视频。以下是本周精选内容，请享用。React 社区的撕逼接下来就是。技术动态Facebook 官方回应社区对 React 的质疑撕逼的事情在国内外都时有发生，本周 Medium 上有篇题为《Things nobody will tell you about React.js》的文章痛批 React，大意为：React 上手太困难，React Native 的 Issue 太多且没人处理，React 及周边工具版本迭代不向前兼容等问题。随后 React 官方维护者 Dan Abramov发表长文回应，澄清了很多外界对 React 的误解。真理越辩越明，仔细看看两篇文章，相信你能收获不少。文章教程React+MobX 组合与 Vue.js 的详细对比React + Mobx 的组合和 Vue.js 在架构上基本是相同的，这篇文章对这两种技术做了比较细节的对比，还有具体的代码，后来附加上了 Preact 这个轻量级的替代。到底哪个好？没有最好的，只有合适的，只有知道各种技术的优缺点你才会做出更合理的选择。代码中添加 ...继续阅读 (3)

前言如果你想学习 React 单元测试，那就从这篇文章开始吧。Star 项目，clone 到本地，根据教程走一遍，有任何问题欢迎issue讨论。项目GitHub地址：react-test-demo文章主要内容如下：Jest 和 Enzyme 的基本介绍测试环境搭建测试脚本编写UI 组件测试Reducer 测试运行并调试参考资料Jest、Enzyme 介绍Jest 是 Facebook 发布的一个开源的、基于Jasmine框架的 JavaScript 单元测试工具。提供了包括内置的测试环境 DOM API 支持、断言库、Mock 库等，还包含了 Spapshot Testing、 Instant Feedback 等特性。Airbnb开源的 React 测试类库 Enzyme 提供了一套简洁强大的 API，并通过 jQuery 风格的方式进行DOM 处理，开发体验十分友好。不仅在开源社区有超高人气，同时也获得了React 官方的推荐。测试环境搭建在开发 React 应用的基础上（默认你用的是 Webpack + Babel 来打包构建应用），你需要安装JestEnzyme，以及对应的babel-jestnpm install jest enzyme babel-jest --save-dev下载 npm 依赖包之后，你需要在package.json中新增属性，配置 Jest："jes ...继续阅读 (13)

为了追求极致的用户体验，很多Web应用采用单页面方式呈现，然而单页面应用，往往对应着高复杂度，比如多层次路由配置、统一数据处理等，这需要项目有一个强大的技术架构和友好的构建环境来支撑。路由器，作为单页面构建的基础，对单页面应用的开发、加载、运行各个环节都起着至关重要的作用，项目体量越大，对路由器的依赖表现越强。下面是一个React应用的基础路由配置，了解React的同学一定不陌生：const App = ()=> { return (</div> </HashRouter> ) } ReactDOM.render(, document.getElementById('root'))是啊，路由配置不就这么简单吗？真正做过单页面应用的同学要反驳你了，并且会立刻提出很多问题：路由配置拆分怎么做？动态加载怎么做？props怎么传递？登录拦截怎么做？列表页能不能缓存？balabala…能遇到这些问题的同学，相信一定是饱经风霜了。这些问题，Demo中是不会有的，都是真实项目中才能遇到的。当然，这篇文章，就是为解决这些问题而生的，下面我们以React-Keeper（以下简称Keeper）为例，来解决这些问题。BTW:React-Keeper是React生态里一款较新的开源路由库，由国内团队开发，借鉴了React-Router 4很多特点，不 ...继续阅读 (17)

比如一个parent组件，有500个子组件，我试了下这500个组件的shouldComponentUpdate方法是顺序阻塞调用的，如果子组件比较多，会浪费很多时间，有没有办法改成异步？ ...继续阅读 (11)

原文地址:YoYo, 一个简易的评论服务GitHut:https://github.com/metrue/YoYo也曾经用过 ‘多说’, ‘disqus’ 等评论服务，都没有觉得太满意，他们都给我一种相同的特别不好的感觉: 喧宾夺主。评论服务，作为一个补充性质的，我的最大的希望就是: 当我在阅读主体文章的时候尽可能的不要引起我的注意，也就是当我不需要进行评论的时候，我应该都不知道这个东西的存在，主要我主动去做评论操作的时候，才会出现。然而无论是 ‘多说’ 还是 ‘disqus’, 他们都在极力的往相反的方向努力。所以我想自己做一个简单的评论服务, 它只要做好下面事情就好了:留下评论，可以订阅更新自动隐藏，需要时候才展现自适应所附着页面的特征所以 YoYo 就诞生了，当然她还只是一个雏形，甚至离 POC 都还有一小段距离，不过她已经为我自己的小博客服役了几天了(虽然我的博客还没有几条评论)，不过高尔老夫司基说了: 你自己觉得烂，不一定是真的烂，所有人觉得烂才是真的烂。所以开放出来，欢迎大家试用.使用方法在任何的页面中插入下面的代码就好了</div></script>其它YoYo 运行在一台每个月 $5 的 linode VPS 上. 她的后端就是由 Koa + Mongo 组成的简单的 Web Server. 她那小小的评论框是一个很小的基于 React 的超微应 ...继续阅读 (15)

大致情况是这样的： 1.代码在这里：https://github.com/NoicFank/iFit2.使用react-native start时出错（错误截图）见最下面，如果开启远端调试，就不会出现这个错误，可以顺利进行。 3.调查了好多说法，可以确定是src/component/FitTime/FetchData.js里的fetch代码出的问题： 代码如下：fetch('http://www.fitnes.cn/jianshen') .then(res => { return res.blob(); }) .then(blobs => { var reader = new FileReader(); reader.readAsText(blobs, 'GBK'); reader.onload = function (e) { var $ = cheerio.load(reader.result); var allText = $('.inner-wrap').children('a'); var allPhoto = $('.nodeImg').children('img'); for (var i = 0; i ...继续阅读 (10)

我定义了一个数组结构 ,如下：imgUrls: { type: Array }我在更新的时候使用save( )方法，之后就疯狂的给我保错：{ MongoError: An empty update path is not valid. at Function.MongoError.create (/Users/yangyss/Desktop/Cool/git/react-koa/node_modules/mongodb-core/lib/error.js:31:11) at toError (/Users/yangyss/Desktop/Cool/git/react-koa/node_modules/mongodb/lib/utils.js:114:22) at /Users/yangyss/Desktop/Cool/git/react-koa/node_modules/mongodb/lib/collection.js:1049:67 at / ...继续阅读 (12)

实践二简单单页应用，使用react-router v4.1.1，styled-components来实现。应用功能：三个导航标签（Home,Stuff,Contact），点击标签切换页面内容。难点分析react-router v4 与以前版本变化较大，做web app时应引入react-router-dom，react-router现在成了其核心库，只包含最基本的功能；styled-components的合理应用，资料少，只能看着官方文档，一点点的试验，一点点的理解；项目结构增加styled目录，自定义样式组件，界面元素几乎都在这个目录中，只有index.html中还引入了一个css文件，定义基本元素的通用设定。-public --index.html --index.css -src --components ---Contact.js ---Home.js ---Stuff.js --containers ---App.js --styled ---Content.js ---Header.js --index.js代码分析路由使用了react-router v4，因此引入的是react-router-dom，开始使用react-router，这现在已经是其核心库，有些组件已经被剥离出去，比如：history，开始一直报错，说：history是必需的，却未定义。若想只用核心库， ...继续阅读 (14)

由OpenDigg出品的前端开源项目周报第十八期来啦。我们的前端开源周报集合了OpenDigg一周来新收录的优质的前端开源项目，方便前端开发人员便捷的找到自己需要的项目工具等。react-moveReact中精致而准确的动画化MeiTuanRN版仿美团客户端curvejs腾讯AlloyTeam正式发布Web魔幻线条forallJavaScript表达式静态类型和不变检查douban基于vue全家桶的精致豆瓣DEMOtas轻量级JavaScript逻辑框架Wuji吾记网页版hrjs在DOM中高亮并替换文本mavonEditor基于Vue的markdown编辑器vue-cnode开源的CNode社区reazy应用于React和RN的简易框架react-native-submit-button动画提交按钮uivVue实现的Bootstrap组件cxlt-vue2-toastr弹出提示的Vue2组件just-scrollCSS3动画页面滚动的简单实现 ...继续阅读 (4)

原文地址：http://reactnative.cn/post/2595 RCTSRWebSocket.m报错 […]您可能也喜欢：React Native Network Request Failed解决方案什么是8秒钟定律？Linux下PHP开启Oracle支持(oci8)ASP 500错误 解决办法MFC程序流程无觅 ...继续阅读 (16)

楼主身为一个非计算机专业的大四学生,目前在学校附近的公司实习,利用工作之余做的第一个redux项目,也是刚刚接触redux 1个月,从最开始的看不懂到现在的能稍微写点东西出来了,希望各位大神觉得哪里做的不好,不足的地方,还请各位批评指正,非常感谢. 同时也是求star!!!项目介绍github地址基于webpack + react + react-router + redux + less + ant + es6 的cnode社区 非常感谢cnode提供的api以及react china社区的各位大神,真的提供了很多的帮助,里面也有很多的例子,都值得去学习运行项目（nodejs 6.0+）git clone https://github.com/zhangfan6644777/Redux-cnode.git cd Redux-cnode npm install npm run dev (开发版本访问：http://localhost:8088/)功能1.登录退出 2.列表分页，下拉自动加载 3.查看帖子,发帖，回复帖子,点赞 4.查看消息 5.个人中心 6.查看别人的资料项目总结1.基本思路就是每个页面对应一个reducerTopic主要是主页的列表信息,上拉加载Article对 ...继续阅读 (14)

学习vue2的过程中，我基本是按照vue2官网的教程走，并且主要以实现需求为主，如果不需要深入vue2的概念，就用简单的方法去实现。本章实现了以下功能：1、列表渲染，v-for；2、条件渲染，v-if；3、自适应布局；4、事件处理器，v-on:click；5、data数据管理。1、列表渲染，v-for；在前面几章已经使用过几次v-for指令了，对此并不陌生，这次更新实现了排行榜列表和歌手列表，以排行榜列表为例，重温一下v-for的用法。Bang.vue：排行榜父组件，bangList是一个数组，for in遍历出来的是一个值属性，根据MDN文档对于for in遍历的解释，通常for in用来遍历对象Object。我们需要给遍历对象指定一个key，然后把遍历出来的属性list传递给子组件。import Bang from './template/BangList.vue' //导入排行榜列表子组件 import { bangList } from '../../static/data/data' //导入数据 export default { name: 'Bang', components: { 'app-bang': Bang }, data() { r ...继续阅读 (12)

技术栈：react + redux + immutable + less + scss + ES6/7 + webpack + fetch + react-router按需加载 + react-transform热替换 + webpack-dev-server + http-proxy-middleware下载git clone https://github.com/wuchujiang/react-lol-spa.git cd react-lol-spa npm install运行（nodejs 6.0+）npm run dev (正常编译模式) npm run hot (热替换编译模式) 访问 http://localhost:8088 npm run dist （发布生产版本，对代码进行混淆压缩，提取公共代码，分离css文件） node server_prd.js (启动生产包node服务，代理api)演示demo（请用chrome的手机模式预览）移动端扫描下方二维码效果图 ...继续阅读 (29)

本篇为译文，原文出处：React Elements vs React Components vs Component Backing Instances许多人可能听说过 Facebook 的React库，并在自己的工作或项目中使用它。React 是非常流行的，使开发用户界面变得简单且符合声明式编程（译者注：声明式编程可以参考声明式编程和命令式编程的比较）。正如题目所示，React 有几个概念遍及其文档，这（几个概念）可能会让新React用户困惑。例如，你在Glossary、Top-Level API和Explanation on Refs这几章中检索 “React Element”、“React Component” 和 “Component Backing Instance”，你会发现这几个术语遍及各处，已经是 React 的绝对的核心。这篇文章不是一篇 React 的教程，更多的是分享我最近学习 React 而得到的一些（知识）。因此，这篇文章是针对之前已经涉猎过 React 的人们，我会假设你已经熟悉 React 一些核心概念和语法。React元素是什么?React 元素这个概念对于 React 来说很重要，但是我坚信一点，因为使用 React 和 JSX 来构建用户界面过于简单，从而导致可能在最初错过这个概念。如果你之前用过 React + JSX，毫无疑问的说，在你的 J ...继续阅读 (14)

React-news一个基于 React + Webpack + es6 + Babel + ant-design 的新闻站点项目主页Github-react_news_site演示地址ReactNews写在前面之前自学过前端自动化工具和angular，但一直没有搭建过一个完整的项目，于是这次认真的做了个基于react新闻网站，自动化工具采用webpack，由于使用了es6的语法，需要用到Babel，Babel是一个广泛使用的转码器，可以将ES6代码转为ES5代码。此项目是根据慕课网教程仿制的，通过此项目也确实学到了很多东西，现在分享出来，也算是我的一个学习总结，完整的视频教程链接对了，觉得好的话不要吝啬你的star哦~~ (✪ω✪)效果图适配了移动端，pc端直接打开上面的链接移动端 预览直接扫码打开网页运行项目安装依赖npm install进入开发模式npm run dev // or webpack-dev-server --inline --hot // 之后打开 localhost:8080 查看如果还没安装node的同学，可把 index.html 里的 script 改成下面的形式，然后直接打开index.html即可webpack配置webpack是一款模块加载器兼打包 工具，它能把各种资源，例如JS（含JSX）、coffee、 ...继续阅读 (2)

一个例子有这样的一个场景如下图所示，有一组动态数量的input，可以增加和删除和重新排序，数组元素生成的组件用index作为key的值，例如下图生成的ui展示：上面例子中的input组件渲染的代码如下所示，全部完整代码可以参考 ==>完整code。{this.state.data.map((v,idx)=>)} //Item组件render方法 render(){ return{this.props.v}}首先说明的是，若页面中数组内容是固定而不是动态的话，上面的代码也不会有什么问题(｡•ˇ‸ˇ•｡ 但是如此这也是不是推荐的做法)。但是，动态数组导致其渲染的组件就会有问题，从上面图中你也能看出问题：数组动态改变后，页面上input的输入内容跟对应的数组元素顺序不对应。为什么会这样呢？本文后面会有解释。react初学者对这可能更加迷惑，本文就来跟大家探讨一下react的key用法，react key概述key的作用react中的key属性，它是一个特殊的属性，它是出现不是给开发者用的（例如你为一个组件设置key之后不能获取组件的这个key props），而是给react自己用的。那么react是怎么用key的呢？react的作者之一Paul O’Shannessy有提到：Key is not really about performance, it’s more about ...继续阅读 (5)

译文,原文来自https://scotch.io/tutorials/s...写在前面,使用webpack已经蛮长一段时间,但是在新项目开始之际,都是东拼西凑其他项目的配置来使用,如果要自己从零开始写一个完整项目的webpack配置估计得费死劲,所以在webpack发布2.x版本之际,正是时候来认真从零开始学习webpack了React是一个出自facebook的js库,用于构建用户交互界面.是一个非常厉害的有很多优势的库,但是却有着非常陡峭的学习曲线.当我开始尝试它,最令我困扰的是,大部分的教程都略过了React开发环境的搭建.译者注: 如果只针对react,你大可以不使用webpack,可以尝试create-react-app,它帮你处理了大部分问题,本文主要使用webpack.所以让我们开始吧,这篇文章非常适合那些害怕沾手react开发环境所需的繁琐的配置而常常采取东凑西拼方式的新手.我的第一个目标就是保持这篇文章简洁易懂.我不会使用任何模板文件,并且你能在github repo上找到完整的设置.我们会使用以下技术:Webpack - 模块打包器Babel - javascript编译器ES6 - 相对较新的javascript的标准Yarn - 包管理器React在这边文章结束之前,我们将设置好一个React的开发环境以及一个简单的打印hello world的页面.去拥抱乐 ...继续阅读 (4)

薪酬待遇：月薪15k-25k，年终绩效奖金为1个月左右的薪金 工作时间：弹性工作时间，工作日+周末都不加班 不加班 工作地址：南京建邺区北纬国际中心（步行5分钟可达地铁10号线“中胜”站） 公司业务：基于微信公众号、微信群、朋友圈、小程序打造品牌企业与用户直连互动的社群平台；并基于采集的交互交易数据做深度挖掘，提供更精准的用户分群和营销指导。基本要求： 1、经验：5-10年工作经验 2、学历：本科及以上，985/211优先 3、专业：计算机相关专业毕业（如计算机软件、自动化、通信工程、应用数学等）职位描述： 1、精通nodejs，有两年左右的开发经验。 2、熟悉koa/express 3、掌握thinkjs/egg/sails中的一种框架 4、熟悉Redis 5、熟悉PostgreSQL/MySQL/MSSQL/Oracle中的一种数据库 6、有微服务/Restful API开发经验 7、有WebSocket、微信公众号后台开发经验者优先团队情况：业务咨询领域由3名15年以上工作经验，并有多年外企从业经历/企业高管经历的资深人士带领；技术领域由3名10年以上工作经验的资深架构师带领。全部员工均来自985/211学校。联系方式：点击链接发送邮件至张波(或直接复制zhangbo@funthinker.cn)另：我司也招聘前端工程师或有志于全栈的工程师，要求熟悉react+redux，有 ...继续阅读 (3)

如何让博客速度快到哭 —— Web 性能优化实践前方高能，一份 PPT 带你看屈屈老师如何分析、优化个人博客~Vue SSR 从入门到 Case Study作者在使用 Vue 服务端渲染之后出现严重性能问题，于是就有了这篇 Case Study。如何处理好前后端分离的 API 问题API 使用的第一原则：不要『相信』前端提供的数据，不要『相信』后台返回的数据。单页应用的数据流方案探索民工叔最近的分享，从 Model Driven View 聊到 Reactive Programming，从 Cycle.js 的 MVI 模型聊到组件化、状态管理。推荐必读。基于 Node.js 的声明式可监控爬虫网络爬虫重构过程的记录。大型高性能 React PWA 如何消除各类性能瓶颈?看看 Twitter Lite 作为一个 React.js PWA 应用是如何消除各类常规与罕见之性能瓶颈的。JavaScript 内存泄漏教程阮老师的讲解内存泄漏、GC 的教程。移动 web 之滚动篇移动端 Web 开发中滚动相关问题及其解决方案的总结。纯 CSS 实现瀑布流布局实现瀑布流布局的三种方式，Multi-columns、Flexbox 和 Grid layout。Matter.js 2D 物理引擎试玩报告物理引擎是一个计算机程序，使用质量、速度、摩擦力和空气阻力等变量，模拟了一个近似真实的物理系统，为 ...继续阅读 (10)

嗯，可能也是最后一版。。。哈哈~~~只是写着玩简化版的redux-form，只是觉得不需要redux-form那么复杂的功能，也不想要和redux关联，而且希望有一个简单管理form的东西，所以就写了一个。肯定有很多不足，比如checkbox/radio group怎么管理。。。没有解决。。。import React from 'react'; export default function reactForm(options){ const { fields=[], initialValues={}, validate, validateOnBlur, withRef } = options; return (Component)=>{ class Form extends React.Component { constructor(props) { super(props); this.initialValues = { ...initialValues, ...props.initialValues }; this.state = this.getInitialFields(); this.touchedKeys = {}; } getInitialF ...继续阅读 (10)

更多资源请Star：https://github.com/maidishike...文章转自：https://github.com/maidishike...4月份前端资源分享1. Javascript关于 ES7 Function Bind Syntax 的思考BOOM：一款有趣的Javascript动画效果CORS跨站资源共享之二最流行的编程语言JavaScript能做什么？到底什么是闭包？JSON.stringify 的第三个参数跨域资源共享 CORS 详解 - 阮一峰前端要给力之：语句在JavaScript中的值 - 周爱民中国第二届FEDay视频花絮编码规范|前端工程师手册奇舞周刊JavaScript 被忽视的细节Chrome 中 scrollingElement 的变化使用 JavaScript 进行单词发音如何优雅地写js异步代码怎样防止重复发送 Ajax 请求？2016年度 JavaScript 展望（上）为什么是 JSONPWebGL 技术储备指南JavaScript数据双向绑定的简单演示关于 JavaScript 的好书有哪些？利用HTML注释的页面翻译解决方案2. 移动Javascript开发移动端 Web 开发踩坑之旅微信公众号编辑器微信浏览器全面升级至X5 Blink内核，支持远程调试JS开发HTML5游戏《悠悠考拉》（一）3. Html5网页头部的声明应 ...继续阅读 (24)

夜猫君の100 家真实面试经历之上海某比特币公司猫哥真实面试经历，多集系列直播分享，不同的各大互联网公司，企业文化、那些奇葩的面试官及那些有意思又或让你蛋疼尴尬的问题。作为一个程序员，你在面试中，又遇到哪些记忆犹新的事情呢？欢迎直播时交流分享。直播当天，猫哥将从以下几个模块来跟大家聊一聊他的面试经验，希望能给你一些启发，学到一点东西。夜猫君，原名张柳，慕课网兼职讲师，实力派全栈工程师，擅长 nodejs 、 react 、 react-native 。直播间（微信扫一扫，五四青年节晚 8 ： 00 准时开扒）本次直播非常适合：正在找工作的程序员，想要跳槽加薪的程序员，以及想要知道自己的水平如何的程序员人群收听~ ...继续阅读 (6)

一、HtmlWebpackPlugin使用：npm install html-webpack-plugin --save-dev解释：这个插件是简化创建生成html（h5）文件用的，如果你引入的文件带有hash值的话，这个尤为的有用，不需要手动去更改引入的文件名！默认生成的是index.html,基本用法为：var HtmlWebpackPlugin = require('html-webpack-plugin'); var webpackConfig = { entry: 'index.js', output: { path: 'dist', filename: 'index_bundle.js' }, plugins: [new HtmlWebpackPlugin()] };js通过script的标签引入到body中！如果你使用了ExtractTextPlugin来提取css，将通过link在head中引入！一般配置：title: 用于生成的HTML文档的标题,也就是html，head中`ceshi` filename: 生成的文件名，default index.html template: 模版（填写相对路径，与配置文件的相对路径，例如：'./index.html' hash: 增加hash值，使每次生成的都是唯一的不重复的二、ExtractT ...继续阅读 (9)

Facebook 一年一度的开发者大会刚过去一半，巧的是这届 F8 大会还正好撞上“速八”（缩写也整好是“F8”），作为 Facebook 每年亮明战略风向标的舞台，这次 F8 大会或多或少让人失望，至少没有给人以震撼的未来前瞻之感。毫无疑问的，在 Facebook 的十年版图里，VR、AR 和 AI 仍是这家公司的未来发展方向，扎克伯格提到，Facebook 将关注点放在社区上，而未来我们的社区会建立在融合了物理和虚拟交互环境中。但或许是 VR 和 AR 的体验仍然达不到理想阶段，前沿科技渗透进大众市场困难，这次 F8 大会上 VR 头盔、AR 眼镜不再是焦点，反倒是手机摄像头，被扎克伯格视作构建未来 AR 的首个增强现实平台（咦，去年明明不是这么说的）。为此，Facebook 宣布推出 Camera Effects 平台，鼓励开发者为 Facebook 创建 AR 效果。那么这个效果是什么呢？简单来说，是通过摄像头捕捉到的内容，来把 2D 图片或事物转换成 3D 效果，另外还有些效果，想必用过 Faceu 或者一些动态贴纸功能的同学都不陌生，就是捕捉人物头像渲染出萌萌的动态贴纸。不过 Camera Effects 的底层会更扎实，该平台集成了实时追踪物体位置的功能、SLAM 算法、机器学习以及图像识别等，相对来说能给到开发者更强大的技术支持。与此同时，Facebook 还提供了 ...继续阅读 (16)