摘要:就为我带来了一种应用状态管理的新思想,其间充斥着许多个概念,等,乍一看头大,等到仔细理解了它的思想,或许就很简单了,也是其中一种。
0x000 概述
写长文章有点累啊,偶尔写点短的文章吧
0x001 概念其实很多框架在技术上没有太大的难度,真正难的是思想,思想的突破远远比技术突破难多了。redux就为我带来了一种应用状态管理的新思想,其间充斥着许多个概念,state、reduce等,乍一看头大,等到仔细理解了它的思想,或许就很简单了,Action Creators也是其中一种。
0x002 栗子看看前面我们是怎么使用redux的:
import {createStore} from "redux" function counter(state = 0, action) { switch (action.type) { case "INCREMENT": return state + 1 default: return state } } let store = createStore(counter) store.subscribe(() => { console.log(store.getState()) }) store.dispatch({type: "INCREMENT"})
我们使用store.dispatch({type: "INCREMENT"})发出了一个action,但是这种方式实在是太不优雅了,存在两个问题:
容易产生重复代码,特别是复杂的action
使用字符串作为type容易出错,重构也不易(200个地方使用了INCREMENT,有一天突然要修改,那就gg了)
对于第二个问题,解决很简单,使用常量就好了
const ACTION_INCREMENT="INCREMENT" store.dispatch({type: ACTION_INCREMENT})
第一个问题,也很简单,使用函数分装起来就好了
const increment = () => { return { type: ACTION_INCREMENT } } store.dispatch(increment())
这个封装起来的函数就是Action Creator了,这种做法就是用函数封装了一下而已。但是在维护性上却有很大提升:
不需要重复的写{....},防止大的aciton写到吐
动态变化时候隐藏细节,异步action、数据拼装...
const increment = (step) => { return { type: ACTION_INCREMENT, step:step } } store.dispatch(increment(5))0x003 总结
在学习一个东西了时候,可以通过实践来理解概念,纯粹的概念很让人头疼啊。
0x004 资源源码
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/97873.html
摘要:的全称是统一资源定位符英文,可以这么说,是一种标准,而网址则是符合标准的一种实现而已。渲染器,将组件渲染到页面上。 0x000 概述 从这一章开始就进入路由章节了,并不直接从如何使用react-route来讲,而是从路由的概念和实现来讲,达到知道路由的本质,而不是只知道如何使用react-route库的目的,毕竟react-route只是一个库,是路由的一个实现而已,而不是路由本身。 ...
摘要:每个接受的和函数作为命名参数,并返回一个函数。调用链中最后一个会接受真实的的方法作为参数,并借此结束调用链。 简介: 手写实现redux基础api createStore( )和store相关方法 api回顾: createStore(reducer, [preloadedState], enhancer) 创建一个 Redux store 来以存放应用中所有的 state reduc...
简介:简单实现react-redux基础api react-redux api回顾 把store放在context里,所有子组件可以直接拿到store数据 使组件层级中的 connect() 方法都能够获得 Redux store 根组件应该嵌套在 中 ReactDOM.render( , rootEl ) ReactDOM.render( ...
摘要:实现一个先不考虑中间件,实现一个简洁的实现是最主要的一个了,通过可以创建一个用来存放应用中所有的,一个应用只能有一个。方法是用来把每一个用方法包裹一下,因为可能只是返回一个具有属性的对象,只有用执行才有意义。正好可以利用的特性实现这个效果。 实现一个redux 先不考虑中间件,实现一个简洁的redux 实现createStore createStore是redux最主要的一个API了,...
阅读 1715·2021-09-23 11:34
阅读 2405·2021-09-22 15:45
阅读 12410·2021-09-22 15:07
阅读 2135·2021-09-02 15:40
阅读 4030·2021-07-29 14:48
阅读 1016·2019-08-30 15:55
阅读 3208·2019-08-30 15:55
阅读 2159·2019-08-30 15:55