分类:

React获取父组件或子组件属性

React获取父组件或子组件属性
获取子组件的方法可以通过递归this.props.children中得到获取父组件的方法方法一:可以通过react内部私有函数this.reactInternalInstance.currentElement.owner.instance获取...

1年前 (2017-07-26) 789℃ 暂无评论 24

怎样自己动手写一个react组件库

怎样自己动手写一个react组件库
引言该系列文章将通过创建一个组件库来引导你学习如何构建自己的组件库。这是该系列的第一部分。该部分将主要关注配置我们的模块和文件结构,但我们最后将会创建一个示例组件...

1年前 (2017-07-14) 1107℃ 暂无评论 27

入门React-router4

入门React-router4
重要API一览路由容器组件BrowserRouter: 浏览器自带的API,restful风格(需要后台做相应的调整);HashRouter: 使用hash方式进行路由;MemoryRouter: 在内存中管理history,地址栏不会...

1年前 (2017-07-06) 1267℃ 暂无评论 29

使用React.js开发chrome插件

使用React.js开发chrome插件
一、背景相信看到这篇文章的人应该都用过Chrome插件吧,最近刚好有个这方面的需求,我就把Chrome插件的相关知识学习了一下,发现其实Chrome插件的开发和大前端Web开发的底子是一...

1年前 (2017-06-24) 369℃ 暂无评论 27

Redux 优化的一些思考

Redux 优化的一些思考
Redux 的书写分离从 Redux 官方示例开始,我们就采用了 actions 和 reducers 分开文件夹来维护的思路。但是在实际业务中,大部分场景下一个 action 触发的 reducer 是在一个子...

1年前 (2017-06-17) 300℃ 暂无评论 28

React应用在产品环境下的性能优化

React应用在产品环境下的性能优化
只有10%~20%的最终用户响应时间花在了下载HTML文档上,其余的80%~90%时间花在了下载页面中的 所有组件 上。 - 性能黄金法则,Steve SoudersSteve Souders在2007年提出这样的“...

1年前 (2017-06-05) 694℃ 暂无评论 26

React单文件的编写方式

React单文件的编写方式
single-react-loader通过该插件,你可以使用单文件形式编写react组件(将jsx与style组合在一起)特性将jsx和css组合在一个文件内支持less,sass支持style样式的私有化例子//about.r...

2年前 (2017-04-27) 256℃ 暂无评论 26

React多语言解决方案

React多语言解决方案
由于框架使用的是 React , 多语言方案也选择了生态系统下的 react-intl 模块,它是雅虎 FormatJS 计划的一部分。翻译字符串替换使用 react-intl 替换字符串用以翻译很方便。只...

2年前 (2017-04-21) 670℃ 暂无评论 35

webpack打包React应用

webpack打包React应用
使用loaders每引入一种loader,就相当于告诉了webpack:当遇到某种类型的文件时,就使用该loader来解析。less项目中使用了less,解析less文件需要使用3个loader:style-loader,css-lo...

2年前 (2017-03-21) 480℃ 暂无评论 29

使用sublime TEXT3开发React Native

使用sublime TEXT3开发React Native
Sublime Text3作为功能强大,使用较为广泛的编辑器,有很强的自定义功能,插件库很庞大,针对新语言插件更新很快,配合使用可以快速搭建适配语言的开发环境。 Sublime Text3为共享软...

2年前 (2017-03-08) 414℃ 暂无评论 26

初识React-React新特性

初识React-React新特性
ReactReact中有两大核心组件:react:核心库 (React)react-dom:提供与DOM相关的功能 (ReactDOM)npm install react react-dom –save-dev1、JSX和DOM操作//->在入口中导入CSS,使...

2年前 (2017-02-19) 507℃ 暂无评论 21

React开发中的HOC与Provider模式

React开发中的HOC与Provider模式
Provider模式许多的React库都需要在所有的组件树中传递数据。比如说,Redux需要传递他的store,而React Router需要传递当前的地址。一个看似可行的方案时使用共享的可变状态,但...

2年前 (2017-02-16) 303℃ 暂无评论 27

SVG + react respinner 的诞生

SVG + react respinner 的诞生
计划开始之前很早之前看到过许多诸如 spinkit、 loader.css、 spin.js 一大堆实现 loading 效果的库,思路基本上是用各种 div 定位到一个icon 大小的 grid 内,再对他们进行不...

2年前 (2017-02-01) 305℃ 暂无评论 21

meteor 和 react 配合使用

meteor 和 react 配合使用
meteor 和 react 配合使用Meteor 和 react 结合在一起使用,意味着 view 层不使用 meteor 自带的 template 模板,而是由 react 组件代替,数据管理则由 meteor 负责。创建项目首...

2年前 (2017-01-21) 259℃ 暂无评论 13

React/JSX 的编码规范(二)

React/JSX 的编码规范(二)
其他代码格式注释组件之间的注释需要用 {} 包裹。引号使用HTML/JSX 属性使用双引号 ";JS 使用单引号 ';条件 HTML简短的输出在行内直接三元运算符;较复杂的结构可以在 .ren...

2年前 (2017-01-16) 176℃ 暂无评论 20

React/JSX 的编码规范(一)

React/JSX 的编码规范(一)
基本规范始终使用 JSX 语法,不要使用 React.createElement 创建 ReactElement,以提高可读性、可维护性、编写速度(没有 JSX 转换的特殊场景例外,如在 console 中测试组件)。每个...

2年前 (2017-01-16) 214℃ 暂无评论 27

使用react redux开发一个待办事宜demo

使用react redux开发一个待办事宜demo
引言&目标我们之前学习了react、redux、react-redux、webpack以及babel的使用方式,那么下面我们使用它们搭建一个待办事宜的程序,通过这个程序我们可以综合使用这些技术,将它们...

2年前 (2017-01-07) 213℃ 暂无评论 22

React系列之 Flux架构模式

React系列之 Flux架构模式
由于 React 只涉及 UI 层的处理,所以构建大型应用应该搭配一个框架模式才能使后期维护成本相对较小~Flux 正是 FB 官方给出的应用架构,他推崇一种单向的数据流动模式,看下图感...

2年前 (2017-01-03) 202℃ 暂无评论 25

React系列之 Redux 架构模式

React系列之 Redux 架构模式
Flux 架构相对来说还是比较繁琐,同时社区也涌现了很多第三方的框架模式,而 Redux 则脱颖而出React 以组件的形式维护了一颗 UI 树,但是对状态数据没有做更多的处理,Redux 则把状...

2年前 (2017-01-03) 204℃ 暂无评论 16

React组件之前是如何通信的

React组件之前是如何通信的
原著序处理 React 组件之间的交流方式,主要取决于组件之间的关系,然而这些关系的约定人就是你。我不会讲太多关于 data-stores、data-adapters 或者 data-helpers 之类的话题...

2年前 (2017-01-01) 352℃ 暂无评论 25