我是Redux toolkit的新手。我看了一些教程，读了一些文章，试着查看文档，我似乎找不到是否可以在Redux toolkit slice files之外发出API请求。作为一个初学者，我希望在需要API的每个组件上调用API，而不是在需要它的组件中获取Redux slice file和dispatch内的API。例如，我在Redux toolkit中有一个userSlice特性，我发出API请求以更新一个名为userCart的存储状态。我有一个组件，我在其中调度了此请求。我想知道是否有一种方法可以在组件内编写准确的API请求代码？以下是我的代码示例：userSlice内部的此API调用：

const initialState={
  token: null,
  loading: false,
  error: false,
  success: false,
  userDetails: {},
  userCart: {},
  userAddress:{}
 }

  //update cart
  export const updateCart = createAsyncThunk('updateCart', async(data, thunkAPI)=>{
  const {cartId, userId, foodId} = data
  try {
    const res = await axios.patch(`${BASE_URL}/cart/${cartId}`, {
        userId: userId,
        foodId: foodId
    }, 
    {withCredentials: true,
    headers: {authorization: `Bearer ${token}`}}
    )

    return res.data
} catch (error) {
    
}
})

const userSlice = createSlice({
name: 'user',
initialState,
reducers:{//codes }
extraReducers:{//codes}
)}

在cart组件中，我只是分派了以下操作：

const handleCartUpdate =()=>{
   dispatch(updateCart(data))
  }

这是一个React原生应用程序。为什么我不喜欢这种格式是因为userSlice可以真正得到大量的API请求代码混乱。例如，API请求处理用户也位于这个文件中，API处理用户地址也位于那里，与购物车一样，等等。我知道我可以有不同的切片，但这就像添加更多的文件到您的代码。