Redux 标签 | 郁子IKUKO

十九、Hello Redux

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Hello Redux</title>
    <script src="https://unpkg.com/redux@4.2.0/dist/redux.js"></script>
  </head>

  <body>
    <div>
      <button id="sub">减少</button>
      <span id="countSpan">1</span>
      <button id="add">增加</button>
      <button id="addFive">增加5</button>
    </div>
  </body>
</html>

郁子大约 1 分钟

二十、@reduxjs/toolkit

（一）使用 RTK 创建 store

1. `src/index.js`

import ReactDOM from "react-dom/client";
import App from "./App";

const root = ReactDOM.createRoot(document.getElementById("root"));

root.render(<App />);

郁子大约 3 分钟

二十一、@reduxjs/toolkit/dist/query/react

（一） Hello RTKQ

1. `src/index.js`

import ReactDOM from "react-dom/client";
import App from "./App";
import { Provider } from "react-redux";
import store from "./store";

const root = ReactDOM.createRoot(document.getElementById("root"));

root.render(
  <Provider store={store}>
    <App />
  </Provider>,
);

郁子大约 13 分钟

（一） 使用 RTK 创建 store

1. src/index.js

（一） Hello RTKQ

1. src/index.js

（一）使用 RTK 创建 store

1. `src/index.js`

1. `src/index.js`