首页下载资源前端redux-thunk-3.0.0-alpha.2.zip

ZIPredux-thunk-3.0.0-alpha.2.zip

a3737337896.8KB需要积分:1

资源文件列表:

redux-thunk-3.0.0-alpha.2.zip 大约有44个文件
  1. redux-thunk-3.0.0-alpha.2/
  2. redux-thunk-3.0.0-alpha.2/.babelrc.js 408B
  3. redux-thunk-3.0.0-alpha.2/.codesandbox/
  4. redux-thunk-3.0.0-alpha.2/.codesandbox/ci.json 109B
  5. redux-thunk-3.0.0-alpha.2/.editorconfig 1.07KB
  6. redux-thunk-3.0.0-alpha.2/.eslintrc 869B
  7. redux-thunk-3.0.0-alpha.2/.github/
  8. redux-thunk-3.0.0-alpha.2/.github/ISSUE_TEMPLATE/
  9. redux-thunk-3.0.0-alpha.2/.github/ISSUE_TEMPLATE/--bug-report.md 370B
  10. redux-thunk-3.0.0-alpha.2/.github/ISSUE_TEMPLATE/--feature-request.md 134B
  11. redux-thunk-3.0.0-alpha.2/.github/ISSUE_TEMPLATE/--support-question.md 94B
  12. redux-thunk-3.0.0-alpha.2/.github/workflows/
  13. redux-thunk-3.0.0-alpha.2/.github/workflows/test.yml 3.9KB
  14. redux-thunk-3.0.0-alpha.2/.gitignore 174B
  15. redux-thunk-3.0.0-alpha.2/.prettierrc.json 113B
  16. redux-thunk-3.0.0-alpha.2/.yarn/
  17. redux-thunk-3.0.0-alpha.2/.yarn/releases/
  18. redux-thunk-3.0.0-alpha.2/.yarn/releases/yarn-3.2.4.cjs 2.09MB
  19. redux-thunk-3.0.0-alpha.2/.yarnrc.yml 66B
  20. redux-thunk-3.0.0-alpha.2/CONTRIBUTING.md 228B
  21. redux-thunk-3.0.0-alpha.2/LICENSE.md 1.06KB
  22. redux-thunk-3.0.0-alpha.2/README.md 12.13KB
  23. redux-thunk-3.0.0-alpha.2/extend-redux.d.ts 1.41KB
  24. redux-thunk-3.0.0-alpha.2/package.json 2KB
  25. redux-thunk-3.0.0-alpha.2/scripts/
  26. redux-thunk-3.0.0-alpha.2/scripts/writeGitVersion.mjs 427B
  27. redux-thunk-3.0.0-alpha.2/src/
  28. redux-thunk-3.0.0-alpha.2/src/index.ts 1.71KB
  29. redux-thunk-3.0.0-alpha.2/src/types.ts 3.4KB
  30. redux-thunk-3.0.0-alpha.2/test/
  31. redux-thunk-3.0.0-alpha.2/test/.eslintrc 401B
  32. redux-thunk-3.0.0-alpha.2/test/test.ts 2.72KB
  33. redux-thunk-3.0.0-alpha.2/test/tsconfig.json 159B
  34. redux-thunk-3.0.0-alpha.2/tsconfig.json 645B
  35. redux-thunk-3.0.0-alpha.2/tsup.config.ts 493B
  36. redux-thunk-3.0.0-alpha.2/typescript_test/
  37. redux-thunk-3.0.0-alpha.2/typescript_test/.eslintrc 415B
  38. redux-thunk-3.0.0-alpha.2/typescript_test/tsconfig.json 132B
  39. redux-thunk-3.0.0-alpha.2/typescript_test/typescript.ts 4.26KB
  40. redux-thunk-3.0.0-alpha.2/typescript_test/typescript_extended/
  41. redux-thunk-3.0.0-alpha.2/typescript_test/typescript_extended/extended-redux.ts 2.32KB
  42. redux-thunk-3.0.0-alpha.2/typescript_test/typescript_extended/tsconfig.json 169B
  43. redux-thunk-3.0.0-alpha.2/vitest.config.ts 452B
  44. redux-thunk-3.0.0-alpha.2/yarn.lock 110.68KB

资源介绍:

Redux 的 Thunk 中间件。它允许编写带有内部逻辑的函数，这些函数可以与 Redux 存储的 dispatch 和 getState 方法交互。
# Redux Thunk Thunk [middleware](https://redux.js.org/tutorials/fundamentals/part-4-store#middleware) for Redux. It allows writing functions with logic inside that can interact with a Redux store's `dispatch` and `getState` methods. For complete usage instructions and useful patterns, see the [Redux docs **Writing Logic with Thunks** page](https://redux.js.org/usage/writing-logic-thunks). ![GitHub Workflow Status](https://img.shields.io/github/workflow/status/reduxjs/redux-thunk/Tests) [![npm version](https://img.shields.io/npm/v/redux-thunk.svg?style=flat-square)](https://www.npmjs.com/package/redux-thunk) [![npm downloads](https://img.shields.io/npm/dm/redux-thunk.svg?style=flat-square)](https://www.npmjs.com/package/redux-thunk) ## Installation and Setup ### Redux Toolkit If you're using [our official Redux Toolkit package](https://redux-toolkit.js.org) as recommended, there's nothing to install - RTK's `configureStore` API already adds the thunk middleware by default: ```js import { configureStore } from '@reduxjs/toolkit' import todosReducer from './features/todos/todosSlice' import filtersReducer from './features/filters/filtersSlice' const store = configureStore({ reducer: { todos: todosReducer, filters: filtersReducer } }) // The thunk middleware was automatically added ``` ### Manual Setup If you're using the basic Redux `createStore` API and need to set this up manually, first add the `redux-thunk` package: ```sh npm install redux-thunk yarn add redux-thunk ``` The thunk middleware is the default export.
More Details: Importing the thunk middleware If you're using ES modules: ```js import thunk from 'redux-thunk' // no changes here 😀 ``` If you use Redux Thunk 2.x in a CommonJS environment, [don’t forget to add `.default` to your import](https://github.com/reduxjs/redux-thunk/releases/tag/v2.0.0): ```diff - const thunk = require('redux-thunk') + const thunk = require('redux-thunk').default ``` Additionally, since 2.x, we also support a [UMD build](https://unpkg.com/redux-thunk/dist/redux-thunk.min.js) for use as a global script tag: ```js const ReduxThunk = window.ReduxThunk ```
Then, to enable Redux Thunk, use [`applyMiddleware()`](https://redux.js.org/api/applymiddleware): ```js import { createStore, applyMiddleware } from 'redux' import thunk from 'redux-thunk' import rootReducer from './reducers/index' const store = createStore(rootReducer, applyMiddleware(thunk)) ``` ### Injecting a Custom Argument Since 2.1.0, Redux Thunk supports injecting a custom argument into the thunk middleware. This is typically useful for cases like using an API service layer that could be swapped out for a mock service in tests. For Redux Toolkit, the `getDefaultMiddleware` callback inside of `configureStore` lets you pass in a custom `extraArgument`: ```js import { configureStore } from '@reduxjs/toolkit' import rootReducer from './reducer' import { myCustomApiService } from './api' const store = configureStore({ reducer: rootReducer, middleware: getDefaultMiddleware => getDefaultMiddleware({ thunk: { extraArgument: myCustomApiService } }) }) // later function fetchUser(id) { // The `extraArgument` is the third arg for thunk functions return (dispatch, getState, api) => { // you can use api here } } ``` If you need to pass in multiple values, combine them into a single object: ```js const store = configureStore({ reducer: rootReducer, middleware: getDefaultMiddleware => getDefaultMiddleware({ thunk: { extraArgument: { api: myCustomApiService, otherValue: 42 } } }) }) // later function fetchUser(id) { return (dispatch, getState, { api, otherValue }) => { // you can use api and something else here } } ``` If you're setting up the store by hand, the default `thunk` export has an attached `thunk.withExtraArgument()` function that should be used to generate the correct thunk middleware: ```js const store = createStore( reducer, applyMiddleware(thunk.withExtraArgument(api)) ) ``` ## Why Do I Need This? With a plain basic Redux store, you can only do simple synchronous updates by dispatching an action. Middleware extends the store's abilities, and lets you write async logic that interacts with the store. Thunks are the recommended middleware for basic Redux side effects logic, including complex synchronous logic that needs access to the store, and simple async logic like AJAX requests. For more details on why thunks are useful, see: - **Redux docs: Writing Logic with Thunks** https://redux.js.org/usage/writing-logic-thunks The official usage guide page on thunks. Covers why they exist, how the thunk middleware works, and useful patterns for using thunks. - **Stack Overflow: Dispatching Redux Actions with a Timeout** http://stackoverflow.com/questions/35411423/how-to-dispatch-a-redux-action-with-a-timeout/35415559#35415559 Dan Abramov explains the basics of managing async behavior in Redux, walking through a progressive series of approaches (inline async calls, async action creators, thunk middleware). - **Stack Overflow: Why do we need middleware for async flow in Redux?** http://stackoverflow.com/questions/34570758/why-do-we-need-middleware-for-async-flow-in-redux/34599594#34599594 Dan Abramov gives reasons for using thunks and async middleware, and some useful patterns for using thunks. - **What the heck is a "thunk"?** https://daveceddia.com/what-is-a-thunk/ A quick explanation for what the word "thunk" means in general, and for Redux specifically. - **Thunks in Redux: The Basics** https://medium.com/fullstack-academy/thunks-in-redux-the-basics-85e538a3fe60 A detailed look at what thunks are, what they solve, and how to use them. You may also want to read the **[Redux FAQ entry on choosing which async middleware to use](https://redux.js.org/faq/actions#what-async-middleware-should-i-use-how-do-you-decide-between-thunks-sagas-observables-or-something-else)**. While the thunk middleware is not directly included with the Redux core library, it is used by default in our **[`@reduxjs/toolkit` package](https://github.com/reduxjs/redux-toolkit)**. ## Motivation Redux Thunk [middleware](https://redux.js.org/tutorials/fundamentals/part-4-store#middleware) allows you to write action creators that return a function instead of an action. The thunk can be used to delay the dispatch of an action, or to dispatch only if a certain condition is met. The inner function receives the store methods `dispatch` and `getState` as parameters. An action creator that returns a function to perform asynchronous dispatch: ```js const INCREMENT_COUNTER = 'INCREMENT_COUNTER' function increment() { return { type: INCREMENT_COUNTER } } function incrementAsync() { return dispatch => { setTimeout(() => { // Yay! Can invoke sync or async actions with `dispatch` dispatch(increment()) }, 1000) } } ``` An action creator that returns a function to perform conditional dispatch: ```js function incrementIfOdd() { return (dispatch, getState) => { const { counter } = getState() if (counter % 2 === 0) { return } dispatch(increment()) } } ``` ## What’s a thunk?! A [thunk](https://en.wikipedia.org/wiki/Thunk) is a function that wraps an expression to delay its evaluation. ```js // calculation of 1 + 2 is immediate // x === 3 let x = 1 + 2 // calculation of 1 + 2 is delayed // foo can be called later to perform the calculation // foo is a thunk! let foo = () => 1 + 2 ``` The term [originated](https://en.wikipedia.org/wiki/Thunk#cite_note-1) as a humorous past-tense version of "think". ## Composition Any return value from the inner function will be available as the return value of `dispatch` itself. This is convenient for orchestrating an asynchronous control flow wi
100+评论
captcha

    相关资源

    1. redux-thunk-2.4.1.zip

      a3737337#前端ZIP161.49KB6月前
      资源摘要:Redux 的 Thunk 中间件。它允许编写带有内部逻辑的函数，这些函数可以与 Redux 存储的 dispatch 和 getState 方法交互。

    2. redux-thunk-3.0.0-alpha.3.zip

      a3737337#前端ZIP896.92KB6月前
      资源摘要:Redux 的 Thunk 中间件。它允许编写带有内部逻辑的函数，这些函数可以与 Redux 存储的 dispatch 和 getState 方法交互。

    3. redux-thunk-3.0.0-rc.0.zip

      a3737337#前端ZIP895.94KB6月前
      资源摘要:Redux 的 Thunk 中间件。它允许编写带有内部逻辑的函数，这些函数可以与 Redux 存储的 dispatch 和 getState 方法交互。

    4. redux-thunk-3.0.0-beta.0.zip

      a3737337#前端ZIP896.79KB6月前
      资源摘要:Redux 的 Thunk 中间件。它允许编写带有内部逻辑的函数，这些函数可以与 Redux 存储的 dispatch 和 getState 方法交互。

    5. redux-thunk-3.0.0-alpha.0.zip

      a3737337#前端ZIP162.3KB6月前
      资源摘要:Redux 的 Thunk 中间件。它允许编写带有内部逻辑的函数，这些函数可以与 Redux 存储的 dispatch 和 getState 方法交互。

    6. redux-thunk-3.0.0-alpha.1.zip

      a3737337#前端ZIP162.29KB6月前
      资源摘要:Redux 的 Thunk 中间件。它允许编写带有内部逻辑的函数，这些函数可以与 Redux 存储的 dispatch 和 getState 方法交互。

    7. redux-thunk-2.4.2.zip

      a3737337#前端ZIP161.48KB6月前
      资源摘要:Redux 的 Thunk 中间件。它允许编写带有内部逻辑的函数，这些函数可以与 Redux 存储的 dispatch 和 getState 方法交互。

    8. redux-thunk-2.4.0.zip

      a3737337#前端ZIP161.4KB6月前
      资源摘要:Redux 的 Thunk 中间件。它允许编写带有内部逻辑的函数，这些函数可以与 Redux 存储的 dispatch 和 getState 方法交互。
    站长QQ:九六九五七三七