React的@reduxjs/toolkit的异步方法处理和实现

一、使用异步方法，需要 createAsyncThunk 函数

1.首先在特定的ts文件中建立异步

const fetchArticles=createAsyncThunk(
  'searchArticle/fetchArticles',
  async({SearchKey,type},thunkAPI)=>{
    const params = {
      Filter: SearchKey,
      PageSize: 10,
      PageNum: 1,
      ArticleType: "",
    };
    const res: any = await GteArticleListApi(params);
    const state = thunkAPI.getState();
    console.log("文章列表",res.ArticleList, state.searchArticle.ArticleList);
    if (type) {
      const newArticle = state.searchArticle.ArticleList.concat(res.ArticleList);
      return newArticle
    } else {
       return res.ArticleList
    }
  }
)

 2.函数接收为两个值，一个是参数（如果有多个参数，请使用对象方式进行传参），另一个是thunkAPI（一个包含dispatch、getState和extra属性的对象，可以用于在异步操作中进行状态更新或其他操作），如果想要获取initialState的state的值，这个参数比不可少。