Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 11 additions & 12 deletions 00_introduction.js
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
// 章节 0 - introduction.js

// 为什么要有这个教程呢
// 在我尝试学习 Redux 的时候,我发现之前的阅读过的一些文章加上个人的经验
// 让我对 flux 产生了一些错误的认知
// 首先,为什么会有这个教程呢
// 在我尝试学习 Redux 的时候,我发现之前阅读过的一些文章加上个人的经验
// 让我对 flux 产生了一些误解
// 当然,我不是说那些关于 flux 的文章写得不好,只是我没能正确地领会其中的概念。
// 到头来,我只是对着各种 flux 框架(Reflux、Flummox、FB Flux)的文档照猫画虎,
// 并试着把它们和之前了解到的理论概念联系起来。
// 等我用了 Redux 之后,我才发现原来flux比我想象的要简单很多
// 这些都归功于 Redux 通过优良的设计来减少样板文件,而其它框架则是为了减少样板文件却又引入了很多新的代码
// 并试着把它们和之前了解到的理论概念联系起来 (actions / actions creators、 store、 dispatcher)
// 等我用了 Redux 之后,我才发现原来 flux 比我想象的要简单很多
// 这些都归功于 Redux 通过优良的设计减少了样板代码,而其它框架则是为了减少样板代码却又引入了很多新的代码
// 我现在觉得用通过 Redux 来学习 flux 比通过其他框架高效得多。
// 这就是为什么我想分享给大家,用我自己的话来说
// 这就是为什么我想分享给大家这个教程
// 通过关注 Redux 的用法来理解 flux 的概念。

// 你一定已经看过这张著名的 flux 的单向数据流图了。
// 你可能已经看过这张著名的 flux 的单向数据流图了。

/*
_________ ____________ ___________
Expand All @@ -36,8 +36,7 @@
*/

// 在这个教程里,我们会一步步地向你介绍上图里的各个概念。
// 我们会把这些概念分成单独的章节来介绍它们存在的意义和作用,
// 而不会笼统地介绍整张数据流图。
// 我们会把这些概念分成单独的章节来介绍它们存在的意义和作用。
// 在最后,当我们理解了每一个概念后,我们会发现这张图真是意义深远啊!

// 在我们开始之前,我们先聊下一 flux 存在的意义以及我们为什么需要它。
Expand All @@ -52,7 +51,7 @@
// - Model 看起来像 Store
// - 用户事件、数据操作以及它们的处理程序看起来像
// "action creators" -> action -> dispatcher -> callback
// - View 看起来像 React view (或者其他什么的)
// - View 看起来像 React view (或者其它类似的概念)

// 所以,flux 就只是一个新名词么?不全是,但是新名词是很重要的,
// 因为通过引入这些新术语我们可以更准确地表述各种专业术语。
Expand Down Expand Up @@ -82,7 +81,7 @@

// 来看一下我们是如何避免 Store A 和 Store B 直接相关联的。
// Store 只能被 action 修改,别无他选。
// 并且当所有 Store 响应了 action 后,最终所有 View 都会更新。由此可见,数据总是沿一个方向进行流动
// 并且当所有 Store 响应了 action 后,View 才会最终更新。由此可见,数据总是沿着一个方向进行流动
// action -> store -> view -> action -> store -> view -> action -> ...

// 上面我们首先从 action 开始我们的用例,
Expand Down