Reactjs 为redux切换查询参数的最佳方法？

redux的新成员。我有一个存储在redux切片中的数据“集合”。我想在API调用中在

&collection=“simulation”

和

&collection=“audit”

之间切换参数，并用新数据替换“collection”。我希望避免在我的redux存储中创建新的切片，而只是在切片中使用switch语句处理api调用：

//collectionSlice.js
import { 
    createSlice, 
    createAsyncThunk
} from '@reduxjs/toolkit'
import axios from 'axios'
import { FETCH_AUDIT_COLLECTION_CONFIG, FETCH_SIMULATION_COLLECTION_CONFIG } from './constants'

const initialState = collectionAdapter.getInitialState({
    fetchStatus: 'idle',
    fetchError: null
})

export const fetchCollection = createAsyncThunk(
    'collection/fetchCollection', 
    async (collectionType) => {
        let collectionConfig;

        switch(collectionType){
            case "audit":
                collectionConfig = FETCH_AUDIT_COLLECTION_CONFIG;
            break;
            case "simulation":
                collectionConfig = FETCH_SIMULATION_COLLECTION_CONFIG;
            break;
        default: "audit";
        };

        const response = await axios(collectionConfig)
    return response.data;
}); 

const collectionSlice = createSlice({
    name: 'collection',
    initialState,
    extraReducers:{
        [fetchCollection.pending]: (state, action) => {
            state.fetchStatus = 'loading';
        },
        [fetchCollection.fulfilled]: (state, action) => {
            state.fetchStatus = 'succeeded';
            collectionAdapter.upsertMany(state, action.payload);
        },
        [fetchCollection.rejected]: (state, action) => {
            state.fetchStatus = 'failed';
            state.fetchError = action.error.message;
        }
    }
});

export default collectionSlice.reducer

以及更改webServiceCollection的代码：

//App.js
import Table from './components/Table';
import { fetchCollection, selectAllItems } from './collectionSlice'
import { useEffect, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux'

export default function App() {
  const dispatch = useDispatch();
  const collection = useSelector(selectAllItems);
  const collectionStatus = useSelector(state => state.collection.fetchStatus);
  const [webServiceCollection, setWebServiceCollection] = useState("audit");

  useEffect(() => {
    if(collectionStatus === 'idle'){
      dispatch(fetchCollection(webServiceCollection));
    }
  }, [collectionStatus, webServiceCollection, dispatch]);

  let content;
  if(collectionStatus === 'loading'){
    content = <p>Loading...</p>
  }else if(collectionStatus === 'succeeded'){
    content = (
      <Table
        collection={collection} 
        collectionType={webServiceCollection}
      />
    );
  }else if(collectionStatus === 'failed'){
    content = <p>ERROR: FETCH FAILED</p>
  }

  const handleCollectionChange = e => {
    setWebServiceCollection(e.target.value)
  }

    return (
        <div style={{ padding: 20 }}>
          <Select
            value={webServiceCollection}
            onChange={handleCollectionChange}
            variant="outlined"
          >
            <MenuItem value={"simulation"}>Simulation</MenuItem>
            <MenuItem value={"audit"}>Audit</MenuItem>
          </Select>
          {content}
        </div>
    )
}

//App.js
从“./components/Table”导入表；
从“/collectionSlice”导入{fetchCollection，selectAllItems}
从“react”导入{useffect，useState}；
从“react redux”导入{useDispatch，useSelector}
导出默认函数App（）{
const dispatch=usedpatch（）；
const collection=useSelector（selectAllItems）；
const collectionStatus=useSelector（state=>state.collection.fetchStatus）；
const[webServiceCollection，setWebServiceCollection]=useState（“审计”）；
useffect（（）=>{
如果（collectionStatus===‘空闲’）{
分派（fetchCollection（webServiceCollection））；
}
}，[collectionStatus，webServiceCollection，dispatch]）；
让内容；
如果（collectionStatus===‘正在加载’）{
内容=正在加载

}否则，如果（collectionStatus===‘成功’）{
内容=(
);
}else if（collectionStatus===‘失败’）{
内容=错误：获取失败

}
const handleCollectionChange=e=>{
setWebServiceCollection（例如target.value）
}
返回(
模拟
审计
{content}
)
}

我的问题是，在我的应用程序中，检查fetchStatus是否为“空闲”的useEffect钩子不会响应webServiceCollection中的更改。因为我希望在redux中将集合保留为单个片段，所以我不想将它们分为auditSlice和simulationSlice。这就是我要做的吗