当渲染一个组件的数据是通过props从父组件中获取时，通常情况下是 A --> B，但随着业务复杂度的增加，有可能是这样的：A --> B --> C --> D --> E，E需要的数据需要从A那里通过props传递过来，以及对应的 E --> A逆向传递callback。组…

1. 中间件（Middleware） 为了解决上面提到的问题，我们需要引入中间件的概念。 中间件执行的时机是在action发起之后，reducer执行之前。 即在dispatch一个action之后，经过一系列的中间件处理过程，再进行reducer。 本质上，中间件就是对dis…

this在javascript中已经相当灵活，把它放到React中给我们的选择就更加困惑了。下面一起来看看React this的5种绑定方法。 如果你使用的是React 15及以下的版本，你可能使用过React.createClass函数来创建一个组件。你在里面创建的所有函数的…

其中涉及到 React 组件复用、轮子设计相关话题，并配合相关场景实例进行了分析。这些内容都算是 React 设计模式，一提到 Design Patterns，读者大可不必恐惧，事实上这都是 React 开发应用灵活性的体现。今天这篇文章，我们继续通过一个场景，循序渐进，通过一…

这是一个计数器，点击按钮，可以让数字加一或者减一。两个按钮在Counter组件里，显示数字的在Number组件里。 首先分析这个需求，点击button，改变数字，Number组件重新渲染。 可抽象为，派发一个动作，改变状态，执行方法。 store是个对象，负责提供getStat…

一个天气预报React应用

webpack4的cli(command line interface)已经移动到webpack-cli了，如果要使用CLI,你需要安装webpack-cli，具体使用可以查看webpack-cli的文档。 由于Babel默认只转换新的JavaScript句法（syntax），…

关于 React 应用加载的优化，其实网上类似的文章已经有太多太多了，随便一搜就是一堆，已经成为了一个老生常谈的问题。 但随着 React 16 和 Webpack 4.0 的发布，很多过去的优化手段其实都或多或少有些“过时”了，而正好最近一段时间，公司的新项目迁移到了 Rea…

掌握 react 的基础特性 * 语法 JSX * 属性 Props * 状态 State * 生命周期 Lifecycle * 事件 Event * 样式 Style