美文网首页React基础
redux真没有那么复杂,通俗易懂,小白必备

redux真没有那么复杂,通俗易懂,小白必备

作者: 生命里那束光 | 来源:发表于2022-04-29 08:18 被阅读0次

一、什么是Redux

Redux 是一个 JS 库,一个状态容器,集中管理项目中共享的状态。
作用类比vuex:

二、Redux的工作原理

redux流程图如下:

1. redux的三个关键函数:getState()、subscribe()、dispatch()

  • getState() :用于获取当前最新的状态
  • subscribe() :用于订阅监听当前状态的变化,然后促使页面重新渲染
  • dispatch() :用于发布最新的状态

2. 单个组件使用redux流程:
(1)创建redux的核心store对象,store集中管理状态。那状态从哪来呢?Reducer

(2)创建Reducer,定义状态的初值、处理状态的方法。 Reducer是只负责执行,那需要判断的东西从哪来呢?Action

(3)在创建Action之前,我们需要创建constant.js定义action中的type类型

(4)创建Action,对定义好的方法进行封装。 那封装好的函数去哪里用呢?在组件中使用

(5)在组件中绑定事件(dispatch()引用封装函数,处理状态),使用getState() 获取最新状态

(6)使用subscribe()订阅store,监听根组件(最外部),只要状态发生改变,就调用render重新渲染组件。

相关文章

  • redux真没有那么复杂,通俗易懂,小白必备

    一、什么是Redux[https://www.redux.org.cn/]? Redux 是一个 JS 库,一个状...

  • redux一些事

    简述redux redux已经用的比较熟了,实际上redux并没有想象中那么复杂,就像redux官方文档说的没有黑...

  • 前端之路——Redux(02)

    上一篇文章中提到,Redux是为了解决在复杂的应用中状态管理的工具。那么,该如何使用Redux呢? Redux的使...

  • 基础入门理财科普,孩子的第一本财商读物

    作为理财小白的基础入门读物,本书实至名归。没有晦涩难懂的专业名词,也不见复杂神秘的操盘模拟,只有通俗易懂,容易实操...

  • Redux 入门教程(React 进阶)(20 个视频)

    最标准,最类似官方的 Redux 基础课教程,学完本套课程,再也不用担心不懂 Redux 了,讲解通俗易懂,详细。...

  • 2020-09-09

    Redux简单介绍: 简单说,如果你的UI层非常简单,没有很多互动,Redux 就是不必要的,用了反而增加复杂性。...

  • redux-thunk学习

    redux-thunk有什么用 redux-thunk是一个redux的中间件,用来处理redux中的复杂逻辑,比...

  • 管理没有那么复杂

    如何管团队?什么是管理?怎么把团队管好?感觉很简单,又复杂的问题!管理不是监督,店长不是监工!不是监督别人做事,让...

  • 生活没有那么复杂

    心有多宽,景色就有多美 人有多淡,快乐就有多少 生活,浓淡相宜 人心,远近相安 生活,不仅需要热情 还要有平和恬淡...

  • 成功没有那么复杂

    世间最容易的事就是坚持,最难的事也是坚持。成功在于坚持,这是一个并不神秘的秘诀。无论做什么事,要取得成功,坚持不懈...

网友评论

    本文标题:redux真没有那么复杂,通俗易懂,小白必备

    本文链接:https://www.haomeiwen.com/subject/gwojyrtx.html