Welcome to Redux Toolkit ! This tutorial will show you the basic functions that are included with Redux Toolkit (also known as “RTK” for short).
欢迎使用Redux Toolkit！这个教程将展示给你Redux Toolkit包含的基础功能（简称RTK）。

This tutorial assumes that you are already familiar with the concepts of the core Redux library, as well as how to use it with React. If you aren’t, please take some time to read through the Redux docs and React-Redux docs first, as the explanations here focus on how RTK usage differs from “typical” Redux code.
本教程假设你已经熟悉核心Redux库的概念。以及如何在React中使用它。如果你不能，请先花些时间去阅读Redux文档和React-Redux文档，因为此处的说明着重于RTK使用和“典型”Redux代码的区别。

Introduction: Writing a Counter Application

介绍：编写一个计数器应用程序

We’ll start by looking at the smallest Redux example: a simple counter application.
我们将通过查看最小的Redux案例开始：一个简单计数器应用程序。

Redux “Counter-Vanilla” Example

Redux “香草计数器”案例

The Redux docs have a “counter-vanilla” example that shows how to create a simple Redux store with a reducer that stores a single number and responds to “INCREMENT” and “DECREMENT” action types. You can see the the complete code as a CodeSandbox here, but here’s the important section:
Redux文档有一个”香草计数器”展示如何使用存储一个数字和响应“INCREMENT”和“DECREMENT”的动作类型的reducer创建简单的Redux store。你可以在CodeSandbox看完整代码，但这是重点部分：

  1. function counter(state, action) {
  2.   if (typeof state === 'undefined') {
  3.     return 0
  4.   }
  6.   switch (action.type) {
  7.     case 'INCREMENT':
  8.       return state + 1
  9.     case 'DECREMENT':
  10.       return state - 1
  11.     default:
  12.       return state
  13.   }
  14. }
  16. var store = Redux.createStore(counter)
  18. document.getElementById('increment').addEventListener('click', function() {
  19.   store.dispatch({ type: 'INCREMENT' })
  20. })

This section creates a reducer function called counter, ensures it uses a default state value of 0, listens for “INCREMENT” and “DECREMENT” action types, and dispatches the “INCREMENT” action type when the button is clicked.
这段创建reducer函数调用counter，确保它使用默认状态值为0,，监听“INCREMENT”和“DECREMENT”操作类型，当点击按钮时派遣“INCREMENT”操作类型

A More Typical Counter Example

一个更典型计数器案例

While this example is simple, it’s also somewhat unrealistic. Most Redux apps are written using ES6 syntax, including default arguments for function parameters that are undefined. It’s also common practice to write “action creator” functions instead of writing the action objects directly in the code, and to write out the action types as constants instead of plain strings each time.
虽然这个例子很简单，但也有些不切实际。更多的应用用ES6语法编写，包含未定义函数参数的默认参数。编写“action creator”函数也是一种惯例，而不是在代码中直接写操作对象， 并且每次将操作类型（action types）写为常量，而不是纯字符串。
**
Let’s rewrite the above example using those approaches to see what it would look like:
让我们使用这些方法重写上述例子，看看它成什么样子：

const INCREMENT = 'INCREMENT'
const DECREMENT = 'DECREMENT'

function increment() {
  return { type: INCREMENT }
}

function decrement() {
  return { type: DECREMENT }
}

function counter(state = 0, action) {
  switch (action.type) {
    case INCREMENT:
      return state + 1
    case DECREMENT:
      return state - 1
    default:
      return state
  }
}

const store = Redux.createStore(counter)

document.getElementById('increment').addEventListener('click', () => {
  store.dispatch(increment())
})