异步action一般指的就是异步action创建函数

action创建函数分为同步action创建函数和异步action创建函数

同步action创建函数(最常见的):

function requestPosts(subreddit) {
return {
type: REQUEST_POSTS,
subreddit
}
}

异步action创建函数(如果利用了redux-thunk,也叫thunk action创建函数,通过使用指定的 middleware,action 创建函数除了返回 action 对象外还可以返回函数。这时,这个 action 创建函数就成为了 thunk):

// 来看一下我们写的第一个 thunk action 创建函数!
// 虽然内部操作不同,你可以像其它 action 创建函数 一样使用它:
// store.dispatch(fetchPosts('reactjs')) export function fetchPosts(subreddit) { // Thunk middleware 知道如何处理函数。
// 这里把 dispatch 方法通过参数的形式传给函数,
// 以此来让它自己也能 dispatch action。 return function (dispatch) {  //redux-thunk使得可以dispatch该函数 // 首次 dispatch:更新应用的 state 来通知
// API 请求发起了。 dispatch(requestPosts(subreddit)) // thunk middleware 调用的函数可以有返回值,
// 它会被当作 dispatch 方法的返回值传递。 // 这个案例中,我们返回一个等待处理的 promise。
// 这并不是 redux middleware 所必须的,但这对于我们而言很方便。 return fetch(`http://www.subreddit.com/r/${subreddit}.json`)
.then(
response => response.json(),
// 不要使用 catch,因为会捕获
// 在 dispatch 和渲染中出现的任何错误,
// 导致 'Unexpected batch number' 错误。
// https://github.com/facebook/react/issues/6895
error => console.log('An error occurred.', error)
)
.then(json =>
// 可以多次 dispatch!
// 这里,使用 API 请求结果来更新应用的 state。 dispatch(receivePosts(subreddit, json))
)
}
}

通过使用redux-thunk中间件,使得可以dispacth一个函数,该函数被thunk中间件调用,且该函数的返回值会作为dispatch方法的返回值,该例中最后返回的是一个promise

store.dispatch(fetchPosts('reactjs')).then(() => console.log(store.getState()))

像 redux-thunk 或 redux-promise 这样支持异步的 middleware 都包装了 store 的 dispatch() 方法,以此来让你 dispatch 一些除了 action 以外的其他内容,例如:函数或者 Promise。

当 middleware 链中的最后一个 middleware 开始 dispatch action 时,这个 action 必须是一个普通对象。这是 同步式的 Redux 数据流 开始的地方(译注:这里应该是指,你可以使用任意多异步的 middleware 去做你想做的事情,但是需要使用普通对象作为最后一个被 dispatch 的 action ,来将处理流程带回同步方式)

异步action和redux-thunk理解的更多相关文章

  1. Redux 和 Redux thunk 理解

    1: state 就像 model { todos: [{ text: 'Eat food', completed: true }, { text: 'Exercise', completed: fa ...

  2. redux学习日志:关于异步action

    当我们在执行某个动作的时候,会直接dispatch(action),此时state会立即更新,但是如果这个动作是个异步的呢,我们要等结果出来了才能知道要更新什么样的state(比如ajax请求),那就 ...

  3. 【React全家桶入门之十三】Redux中间件与异步action

    在上一篇中我们了解到,更新Redux中状态的流程是这种:action -> reducer -> new state. 文中也讲到.action是一个普通的javascript对象.red ...

  4. Redux学习笔记--异步Action和Middleware

    异步Action 之前介绍的都是同步操作,Redux通过分发action处理state,所有的数据流都是同步的,如果需要一步的话怎么办? 最简单的方式就是使用同步的方式来异步,将原来同步时一个acti ...

  5. Redux 处理异步 Action

    redux-promise-utils What redux-promise-utils 是一个基于 redux-thunk 和 redux-actions 的工具,符合 FSA 规范,方便开发者处理 ...

  6. Redux thunk中间件

    redux-thunk https://github.com/reduxjs/redux-thunk Why Do I Need This? Thunks are the recommended mi ...

  7. redux-amrc:用更少的代码发起异步 action

    很多人说 Redux 代码多,开发效率低.其实 Redux 是可以灵活使用以及拓展的,经过充分定制的 Redux 其实写不了几行代码.今天先介绍一个很好用的 Redux 拓展-- redux-amrc ...

  8. redux的理解

    Redux 这里介绍下我对Redux的理解,不涉及如何使用Redux. Redux 官网介绍: A predictable state container for JavaScript apps.(一 ...

  9. ASP.NET MVC下的异步Action的定义和执行原理

    一.基于线程池的请求处理ASP.NET通过线程池的机制处理并发的HTTP请求.一个Web应用内部维护着一个线程池,当探测到抵达的针对本应用的请求时,会从池中获取一个空闲的线程来处理该请求.当处理完毕, ...

随机推荐

  1. vue $attrs 父组件和孙子组件的传值,传函数

    上一篇我们说到provide/inject的依赖注入的传值方法,今天我们来说一下另一个父组件给孙子组件的传值方式$attrs 我们接着上一个例子继续来写 parent父组件 我们给child子组件穿了 ...

  2. CSS3新增(选择器{属性选择器,结构伪类选择器,伪元素选择器})

    1.属性选择器 属性选择器,可以根据元素特定的属性来选择元素,这样就不用借助 类 或者 id选择器. E [ att ]   选择具有 att 属性的 E 元素   例如:input [ value ...

  3. Android中XML的命名空间、自定义属性

    命名空间(namespace) XML 命名空间提供避免元素命名冲突的方法. 举个例子,A学校有名学生叫做林小明,B学校也有名学生叫林小明,那我们如何识别这两名拥有相同名字的同学呢?这时候命名空间就派 ...

  4. tee - 从标准输入写往文件和标准输出

    总览 (SYNOPSIS) tee [OPTION]... [FILE]... 描述 (DESCRIPTION) 把 标准输入 的 数据 复制到 每一个 文件 FILE, 同时 送往 标准输出. -a ...

  5. Apache启动后出现You don't have permission to access on this server的解决办法

    安装好wampserver想在浏览器打开运行php的结果,发现: You don't have permission to access on this server 解决办法是: 在Apache的根 ...

  6. 升级ssh后续问题

    升级了openssh后远端的服务器无法通过sftp传输文件到高服务器,后来发现是远端的服务器ssh版本太低,而新升级了openssh的服务器已经不再支持老版本ssh client的相关协议,这时候有两 ...

  7. nginx 和keepalived的使用

    今天看了培训视频,看到这俩玩意,挺有意思,先粘贴一下,别等到时候忘了. 官方网站 www.nginx.org nginx的特点 稳定版本是用偶数来做标记,测试版本使用奇数作为标记 通过yum来安装 安 ...

  8. 【JDK1.8】Java 栈实现方式

    看到一道面试题,问Java中栈的实现方式,记录下一些实现细节. API中有5个方法,分别是: boolean empty() E peek() E pop() E push() int search( ...

  9. ubuntu颜色配置

    对于刚接触ubuntu的同学们,打开终端(ctrl+alt+T),会发现里面都是一个颜色,不管是用户名.主机名还是命令都是白色,当然,用 ls 列出文件的时候是会多一种颜色的.即使这样,对开发人员来说 ...

  10. git暂存区

    在使用git开发时,有三个概念需要知道,工作区,暂存区和版本库.工作区就是直接进行操作的地方,版本库是要将修改提交的地方,那么暂存区是干什么的呢?下面将对暂存区深入研究. 一.修改后能直接提交吗? 在 ...