Redux基本用法,为周日的先行者课程准备着。

众所周知,React只是一个View层而已,它不是一个完整的前端解决方案。只是给出了页面组件化的解决思路,但组件之间如何沟通?代码之间的结构?它并没有给出更多的内容。顶多也就是一些jsx的语法格式,但这点点的约定并不足以支撑一个大型

项目的开发。

后来,大概是14年的时候,React的亲爹Fackbook搞了个flux;然后到了2016年吧,Redux就出现了,这个东西再加上React,才可以称得上一个前端架构。

先来说一个Redux是干嘛的,它其实和vue.js的vuex特别的像,都是为了管理多个组件之间的数据的。就是把数据或是状态吧,都放在组件树之外的一个公共的地方,然后根据需要去操作它。

主要应用场景应该是大的复杂的项目或是spa单页应用,使用redux比较好。如果是一些简单的东西,那就有点大才小用了。

总体来讲,就是多交互,多角色,多个数据源,一个组件的状态在不同的情况下要保持数据的一致或不一致,多个组件的状态会相互影响并产生链式反应的这些情况下,应该是需要使用redux的。

如果你使用过vuex,那就很容易理解redux的思想。如果没有也没关系,反正redux的中心思想就是二句话:

1,组件是一个状态机,状态与视图相对应;

2,所有组件的所有状态,都放在一个全局对象里。

确定你理解上述二句话,那么下面的东西会很简单。

所有的状态,放在哪?

Store,就在这里,每个应用只有一个Store对象。创建它使用createStore方法。

想得到某个点的状态,怎么办?

状态是啥?State,咋获得?getState();找谁用?store.getState()。

很好理解吧,

状态和视图一一对应,视图变了,咋更新状态?

使用Action,它是个啥?对象。谁使用?View,视图,它来使用Action。

Action,是改变state的唯一办法。(这思路和vuex完全一样)

Store收到了Action以后,会发出一个新的State,这时view会发生变化。

这个过程,就是Reducer,这时,view就不一样了。

细说起来也挺长的,详细的内容,咱们周日再聊吧。

原文发布于微信公众号 - web前端教室(webfeel)

原文发表时间:2017-08-03

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏一“技”之长

iOS8新特性扩展(Extension)应用之二——分享插件

        在上一篇博客中,介绍了iOS8新特性扩展功能之一的Today功能:http://my.oschina.net/u/2340880/blog/48...

912
来自专栏三水清专栏

iOS 真机调试微信小程序

平时开发小程序可以在开发者工具中进行调试,开发者工具提供了类似 Chrome DevTools 的调试面板,对于前端开发者来说入门门槛比较低。

1.7K10
来自专栏GopherCoder

Django:web框架的学习(3)

1523
来自专栏互联网杂技

AngularJS 对SEO是硬伤

在过去的2014年, 前端开发因为大量前端框架的出现开发模式有了巨大的改变,MVC这个web服务器端开发的模式,由于angularjs们的出现,变成了前端MVV...

7397
来自专栏SHERlocked93的前端小站

Vue项目骨架屏注入实践

相比于早些年前后端代码紧密耦合、后端工程师还得写前端代码的时代,如今已发展到前后端分离,这种开发方式大大提升了前后端项目的可维护性与开发效率,让前后端工程师关注...

4674
来自专栏Python、Flask、Django

有没有什么好看的网址,想爬点东西做个可视化

1672
来自专栏WindCoder

WordPress中通过Ajax评论分页实现方法

一直看着评论一线到底,感觉有点不舒服,看到主题君欲思大大那的评论也分页了,就向大大求援了一下,大大酷酷的回了一句paginate_comments_links函...

2481
来自专栏上善若水

P003PHP之用户页面注册信息填写页面[转]

php用户注册页面填写信息完整实例,内容包括邮箱自动匹配、密码强度验证以及防止表单重复等.

1393
来自专栏WindCoder

WordPress常用插件分享

8081
来自专栏GIS讲堂

selectToUISlider

没错,就是这个公能,最近做一个WEB的项目,也要用到类似的功能,所以呢就研究了一下,刚开始的时候,记得Jquery UI里面有一个slider的东西,可以实现类...

1333

扫码关注云+社区

领取腾讯云代金券