问： 我有一个调用自己的函数: def get_input(): my_var = input('Enter "a" or "b": ') if my_var !...: Type "a" or "b": a got input: a 但是，如果我输入别的东西，然后输入 "a" 或 "b"，我会得到这样的结果: Type "a" or "b": purple You...Type "a" or "b": a got input: None 我不明白为什么 get_input() 函数返回的是 None，因为它本应只返回 my_var。这个 None 是从哪里来的？...我该如何修复我的函数呢？ 答： 它返回 None 是因为当你递归调用它时: if my_var != "a" and my_var !...Python3 documentation 因此，除了在 if 语句中调用 get_input() 之外，还需要返回递归调用返回的内容。
但是我们的应用里面经常会有定时器，网络请求等等异步操作，使用Redux-Thunk就可以发出异步的action： function increment() { return { type:...在继续深入源码前，我们先来思考一个问题，为什么我们要用Redux-Thunk，不用它行不行？...我之前就告诉过你：只要使用了Redux Thunk，如果你想dispatch一个函数，而不是一个纯对象，这个中间件会自己帮你调用这个函数，而且会将dispatch作为第一个参数传进去。...这就是为什么你可以在thunk中返回一个Promise并且等他完成： dispatch(someThunkReturningPromise()).then(...)...} } 复制代码 处理thunk 根据我们前面讲的，thunk是一个函数，接收dispatch getState两个参数，所以我们应该将thunk拿出来运行，然后给他传入这两个参数，再将它的返回值直接返回就行
(() => { state.count++ }) } } 现在想象，我们正在 debug 一个 app 并且观察 devtool 中的 mutation 日志。...Redux 先从Redux的设计层面来解释为什么Reducer必须是纯函数 如果你经常用React+Redux开发，那么就应该了解Redux的设计初衷。...Redux的设计参考了Flux的模式，作者希望以此来实现时间旅行，保存应用的历史状态，实现应用状态的可预测。...所以整个Redux都是函数式编程的范式，要求reducer是纯函数也是自然而然的事情，使用纯函数才能保证相同的输入得到相同的输入，保证状态的可预测。...所以Redux有三大原则： 单一数据源，也就是state state 是只读，Redux并没有暴露出直接修改state的接口，必须通过action来触发修改 使用纯函数来修改state，reducer
它最初的创建是为了帮助解决关于 Redux 的三个常见问题： “配置 Redux 存储太复杂了” “我必须添加很多包才能让 Redux 做任何有用的事情” “Redux 需要太多样板代码” 我们无法解决所有用例...Redux Toolkit 还包括一个强大的数据获取和缓存功能，我们称之为“RTK Query”。它作为一组单独的入口点包含在包中。它是可选的，但可以消除您自己手写数据获取逻辑的需要。...无论您是设置第一个项目的全新 Redux 用户，还是想要简化现有应用程序的经验丰富的用户，Redux Toolkit都可以帮助您改进您的 Redux 代码。...它可以自动组合你的 slice reducer，添加你提供的任何 Redux 中间件，redux-thunk默认包含，并启用 Redux DevTools Extension。...createAsyncThunk: 接受一个动作类型字符串和一个返回承诺的函数，并生成一个pending/fulfilled/rejected基于该承诺分派动作类型的 thunk import { createAsyncThunk
经典的异步 Action 解决方案redux-thunk 在针对 Redux 源码主流程的分析中，我们不难看出这样一个规律：Redux 源码中只有同步操作，也就是说当我们 dispatch action...action，注意这个 action 是一个函数 store.dispatch(payMoney(payInfo)); 这里我尝试用 redux-thunk 模拟了一个付款请求的发起 响应过程。...redux-thunk 的源码其实非常简洁，我第一次接触时还是在 2016 年，这么多年过去了，很多事情都变了，唯一不变的是 redux-thunk，它仍然那么好懂。...若 action 是一个函数，那么 redux-thunk 就会执行它并且返回执行结果；若 action 不是一个函数，那么它就不是 redux-thunk 的处理目标，直接调用 next，告诉 Redux...为什么我们的应用需要中间件呢？这里，我就以 Redux 中间件机制为例，简单和你聊聊中间件背后的“面向切面”编程思想。
Redux Thunk 是一个中间件，它允许 Redux 返回函数而不是 actions。这就允许你在延迟处理 actions 的时候结合 promises 使用。...该中间件的主要应用包括处理潜在的异步 actions 操作，例如使用 Axios 发送一个 GET 请求。...借助 Redux Thunk，我们可以异步 dispatch 这些操作并返回 promise 处理的结果。...action 对象应该被返回，因为 action 是一个对象。Redux-thunk 允许一个 action creator 返回一个函数！现在，我们可以做任何异步工作。...怎么使用 Redux Thunk: 构建一个购物车 在本教程中，我们将使用 Redux Thunk 开发一个简单的购物车功能，更好地明白 Thunk 怎么工作。
简单介绍一下thunk，这是一个中间件，是解决redux异步问题产生的。...我们都知道，在使用redux的时候，通过dispatch一个action 发生到reducer 然后传递给store修改状态 一系列都是同步的，那如果说我dispatch一个action 这个action...可以将 thunk 看做 store 的 dispatch() 方法的封装器；我们可以使用 thunk action creator 派遣函数或 Promise，而不是返回 action 对象。...) // 应用thunk中间件 ); // 在对dispatch函数进行映射时 action creator 可以直接返回一个函数 不用直接返回action 这使得里面可以写异步操作 先去请求接口 在去...dispatch一个action到reducer // 当应用了thunk中间件时 action creator返回的函数都会默认传递一个dispatch的方法 然后再去dispatch action
一、redux-thunk介绍 redux-thunk用于处理异步action，同类型的有redux-saga 二、学习网址 https://github.com/reduxjs/redux-thunk.../reducers'; // 创建store的时候，第二个参数是中间件，redux-thunk提供了一个thunk中间件，用于处理异步的action export default createStore...( rootReducer, applyMiddleware(thunk) ); //异步的action, 由于使用了redux-thunk的thunk中间件， //所以，在这个action里不用像同步...action那样，必须返回一个对象，在这里返回一个方法 //这个方法有一个dispatch的参数，这个dispatch就是store里的dispatch. export const addAsync =...，就会执行相应的操作(把isLoading改为true,看reducer里的代码) dispatch({ type: START_GET_DATA }); // 用setTimeout
大家好，又见面了，我是你们的朋友全栈君。 简介 这次要总结的是对 store 和 reducer 的拓展，比如发送异步的 action 操作，还有一个就是对多个 reducer 的管理。...，这个函数可以接受两个参数，一个是 dispatch ，另一个是 getState ,然后在里面进行异步操作，我这里设置了 2秒 然后添加了一个用户，点击之后，过了 2秒 我的用户才会被添加进去，而页面也是等到...这种异步思路就是使用 Action Creator 返回一个函数，然后使用 redux-thunk 让 dispatch 能够接受一个函数作为参数。...logger) // 按照严格的循序 ); 上一种方法是使用 Action Creator 返回函数来操作异步，使用 redux-promise 可以让它返回一个 promise 对象，可以使用...让它能够返回一个 使用 promise ，接着我们调用 使用 deleteUserData 函数时就可以执行 then 的操作。
某个组件的状态，需要共享 某个状态需要在任何地方都可以拿到 一个组件需要改变全局状态 一个组件需要改变另一个组件的状态 1.2、为什么要用Redux 在React中，数据在组件中是单向流动的，这是react...reducer会根据传入的action的type值对state进行不同的操作，然后返回一个新的state，而不是在原有state的基础上进行修改,但是如果遇到了未知的（不匹配的）action，就会返回原有的...从简单的 react-thunk 到 redux-promise 再到 redux-saga等等，都代表这各自解决redux异步流管理问题的方案 4.1 、redux-thunk redux-thunk...正因为这个action creator可以返回一个函数，那么就可以在这个函数中执行一些异步的操作，就比如网络请求。...从同步异步的角度来说这个问题：想让异步变成类似同步的操作我们应该怎么办，大家想到的肯定是async/await，阻塞代码，我开始一直陷入一个误区，我内部的确造成了阻塞，等到data有值了，才会dispatch
本文作者：IMWeb EnjoyChan 原文出处：IMWeb社区 未经同意，禁止转载 项目中使用redux-thunk来解决异步请求的问题，但是为什么要引入redux-thunk来解决异步请求问题...redux-thunk, 或者说redux-thunk可以解决什么场景问题；来看下面这个场景，我们上面那份代码可能被多次调用，根据传入参数来执行，于是我们封装一个函数： // 2 function encapsulateFunc...action creator，不需要关心同步还是异步，返回的是对象还是函数，只需要关注传入的参数； 观察ecncapsulateFunc，我们会发现它返回了一个函数，参数传入dispatch,我们称ecncapsulateFunc...，封装设计更合理，当然redux-thunk是在我们需要的时候才引入，如果我们的实际项目明明可以简单解决，就不需要引入redux-thunk了。...], [enhancer]) 第三个参数enhancer可选，也就是说applyMiddleware方法返回了一个enhancer，这里的enhancer就是store enhancer, 所谓的enhancer
大家好，又见面了，我是你们的朋友全栈君。...redux-thunk处理副作用的缺点 redux-saga写一个hellosaga redux-saga的使用技术细节 redux-saga实现一个登陆和列表样例 ---- 1.redux-thunk...比如下面是一个获取商品列表的异步操作所对应的action： export default ()=>(dispatch)=>{ fetch('/api/goodList',{ //fecth返回的是一个...action不易维护的原因： action的形式不统一 就是异步操作太为分散，分散在了各个action中 2.redux-saga写一个hellosaga 跟redux-thunk,redux-saga...(plain object) 对比redux-thunk我们发现，redux-saga中监听到了原始js对象action，并不会马上执行副作用操作，会先通过Effect方法将其转化成一个描述对象，然后再将描述对象
---- redux middleware 是 redux 的一个 advanced feature. 这个概念并不是很新奇,以为在 Koa 里面早已经实现过了....他的最终结果是，针对不同 reducers 返回的结果，一般只能影响到本 reducers 里面的内容。...redux-thunk ....(thunk) ); // thunk 类型的中间件 function doSth(forPerson) { // 这里必须返回一个函数......可以实现 私有, 定制化的 中间件操作.
redux-thunk 不就是那个只有 14 行代码的轮子嘛？我一行就能写出来还要你来教我做事？ 不错，redux-thunk 是一个非常小的库，不到 5 分钟就能理解并造出来。...但是今天我并不想从 “怎么造” 这个角度来讲这个轮子，而是想从 “为什么” 这个角度来聊一聊这个轮子的是怎么出现的。...不过，我觉得这是从结果出发找造这个轮子的原因，并不能从需求层面解释这个中间件到底解决了什么问题。 本文希望从解决问题的角度来推导 redux-thunk 诞生的原因。...doSomthing(我的参数) // dispatch 修改值 dispatch(...) } 为了下次懒得再一次解释这样的函数结构，干脆用一个词这概括它，就叫它 "thunk" 吧。...函数 发现直接赋值是个很笨的行为，比较高级的是使用中间件来改写 dispatch 函数 最后，我们做了一个中间件出来，就叫做 redux-thunk 总结 最后来回答一些我在 redux 社区里看到的一些问题
)注册监听器;通过 subscribe(listener)返回的函数注销监听器React中的props为什么是只读的？...为什么 React 要用 JSX？JSX 是一个 JavaScript 的语法扩展，或者说是一个类似于 XML 的 ECMAScript 语法扩展。它本身没有太多的语法定义，也不期望引入更多的标准。...（1）使用react-thunk中间件redux-thunk优点:体积⼩: redux-thunk的实现⽅式很简单,只有不到20⾏代码使⽤简单: redux-thunk没有引⼊像redux-saga或者...redux-observable额外的范式,上⼿简单redux-thunk缺陷:样板代码过多: 与redux本身⼀样,通常⼀个请求需要⼤量的代码,⽽且很多都是重复性质的耦合严重: 异步操作与redux的...(thunk));const store = createStore(reducer, enhancer);export default store;添加一个返回函数的actionCreator，将异步请求逻辑放在里面
就要使用中间件了，而redux-thunk就是这样一个中间件。...具体的改变 ---- 之前action creator返回的是action对象，现在可以返回一个thunk函数，这个函数可以执行一些副作用，不再需要保持它的纯净。...复杂用法 ---- 就是说在action creator中还可以dispatch其他的action creator，不论是返回action对象还是返回一个函数。...这对于操作异步流来说真是太方便了，想一想.then().then(). . . 另一个就是传入extraCustomArgument参数。这一部分请直接参考redux-thunk官方文档。...可以看出，redux-thunk就是一个扩展功能的中间件，它的源代码实现非常少！之后估计也要学习一下，到时再写一篇文章。
但是如果是异步操作，比如一个网络请求，我们需要等到请求返回之后才会返回action，怎么办呢？...import thunk from 'redux-thunk'; import { rootReducer } from '....以及如何重构reducer的代码？可以移步另一篇博客：如何最佳实践的设计reducer。 那么，回到最初的话题，引入Redux到我们的应用中，到底有什么好处？我们为什么需要一个专门的状态管理器？...另外，Redux还让前后端彻底分离变成了可能，这一点也有极大的意义。 Redux的数据流 Redux通过一些限制告诉你：数据只能保存在我这儿，别想太分散！想要修改数据？...告诉我一个带新数据的action，我会通过reducer自动修改，然后返回修改后的数据给你！ 是的，redux很想“数据库”，数据被集中存储，并且只能通过“预先定义的action操作”来修改。
这样写是因为 connect 是一个高阶函数，它简单说就是当你调用它时会返回一个函数。然后调用返回的函数传入一个组件时，它会返回一个新（包装的）组件。...你可以简写成 mapState 或者用任何你想的方式调用。只要你接收 state 对象然后返回全是 props 的对象，那就没问题。 为什么不传整个 state？...“thunk” 是（少见）指被其它函数作为返回值的函数。...通常我把它们一起称为 “thunk action”。 Action 生成器返回的函数接收两个参数：dispatch 函数和 getState。...不要直接传 thunk。 结合 Redux 请求数据的例子 设想一下你想展示一个产品列表。
fetchPosts 代码如下： 操作结束后，再发出一个 Action，触发 State 更新为“操作结束”，View 再次重新渲染redux-thunk异步操作至少送出两个 Action，第一个 Action...Action Creator，执行返回一个函数，该函数执行时dispatch一个 action，表明马上要进行异步操作；异步执行完成后，根据请求结果的不同，分别dispatch不同的 action 将异步操作的结果返回回来...这里需要说明几点： fetchPosts返回了一个函数，而普通的 Action Creator 默认返回一个对象。...在返回的函数之中，先发出一个 store.dispatch({type: SET_DEMO_DATA.PENDING})，表示异步操作开始。...针对以上操作尝试梳理了一个简单demo大家可以查看github。 如果你有任何想法欢迎直接「留言」与我交流，那将是我进步的动力！
在最初的调研中redux-thunk是首先考虑的，redux-thunk是在action作用到reducer之前触发一些业务操作。刚好起到控制层的作用。...但是，马上了解到了redux-sage，因为大家都在对比两者。本文并不会做对比，在文章的最后会简单介绍为什么选了Saga而不是thunk的原因，仅供参考。...拿到后端返回状态 （promise so easy…） 隐藏提示信息 (这个有点难度，不过难不倒我，我给组建加一个控制属性) 更新redux store （dispatch咯。。。）...call方法 call有些类似Javascript中的call函数， 不同的是它可以接受一个返回promise的函数，使用生成器的方式来把异步变同步。...这句话使我决定了尝试用saga或thunk来实践把前端分层的设想。
领取专属 10元无门槛券
手把手带您无忧上云
