学习react/tootik笔记

Redux Toolkit 是最新的redux状态管理，里面有很多可用的api使用首先从安装redux toolkit开始，敲如下命令行进行安装：
npm install @reduxjs/toolkit
然后在项目中使用：
//store.js
import { configureStore } from "@reduxjs/toolkit";
import couterReducer from "./modules/counter";

const store = configureStore({

reducer: {
    counter: couterReducer
}

})

export default store;

创建一个模块
//counter.js
import {createSlice} from "@reduxjs/toolkit";

const couterReducer=createSlice({

name:"counter",
initialState:{
    couter:99
},
reducers:{
    increment(state){
        state.couter++
    },
    decrement(state){
        state.couter--
    }
}

})
export const { increment, decrement } = couterReducer.actions
export default couterReducer.reducer
在react中引入使用

import { useSelector, useDispatch } from "react-redux";
import { increment, decrement } from "../store/modules/counter"
const state = useSelector((state) => {

    return {
        counter: state.counter.couter
    }
})
const dispatch = useDispatch()
const incrreat = () => {
    dispatch(increment())
}
const dncreat = () => {
    dispatch(decrement())
}

在hook中使用，比起以前的用法简洁多了