Инструментарий Redux: как я могу вызвать действие createAsyncThunk с помощью аргументов из reducer после обновления состояния?

#reactjs #redux-toolkit

#реагирует на #redux-инструментарий

Вопрос:

вот так!

Я работаю над интерфейсом, который позволяет загружать некоторые условия фильтрации из файла. Вид интерфейса

После получения объекта JSON из файла я обновляю состояние приложения в соответствии с требуемыми полями. После Просмотра Импорта

Последнее поле «Значение» является динамическим, и я получаю его поля ПОСЛЕ того, как пользователь выбирает значение из поля «Параметр». Это прекрасно работает, если пользователь выбирает все вручную. Но когда я «автозаполняю» файл, я не могу выполнить вызов, чтобы получить значения поля «Значение».

Вопрос: как я могу вызвать getFilterValuesAction из файла importRulesFromFile редуктора?

 export const filterCategoriesSlice = createSlice({ name: 'filtersRow', initialState,  reducers: {    importRulesFromFile(state, action) {  state.rows.length = 0 // to empty a rows  const importedParams = action.payload   importedParams.map((el, i) =gt; {  const newRow = { ...rowTemplate }   newRow.id = uuid()  newRow.selectedCondition = state.conditions[el.operation]  newRow.selectedOperator = el.operator  newRow.selectedParam = el.parameterName  newRow.selectedValue = el.value  state.rows = [ ...state.rows, newRow ]  })  }, },  extraReducers: {  /**  * Request for VALUES-based on SelectParams  * @param state  * @param action  */  [getFilterValuesAction.pending.type]: (state, action: PayloadActionlt;string[]gt;) =gt; {   const rowId = action.meta.arg.rowId;  const newRows = [ ...state.rows ]  const rowToUpdate = newRows?.findIndex((item) =gt; item.id === rowId)   state.rows[rowToUpdate].isParamsLoading = true;  },  [getFilterValuesAction.fulfilled.type]: (state, action: PayloadActionlt;string[]gt;) =gt; {   const rowId = action.meta.arg.rowId;  const newRows = [ ...state.rows ]  const rowToUpdate = newRows?.findIndex((item) =gt; item.id === rowId)   state.rows[rowToUpdate].values = action.payload  state.rows[rowToUpdate].isParamsLoading = false;  state.isError = '';   },  [getFilterValuesAction.rejected.type]: (state, action: PayloadActionlt;stringgt;) =gt; {  // @ts-ignore  const rowId = action.meta.arg.rowId;  const newRows = [ ...state.rows ]  const rowToUpdate = newRows?.findIndex((item) =gt; item.id === rowId)   state.rows[rowToUpdate].isParamsLoading = false;  state.isError = action.payload;  }, }  

}); экспорт фильтра по умолчанию categoriesslice.reducer;

Действие по API:

 export const getFilterValuesAction = createAsyncThunk( 'fetchFilterValuesByParam', async (data: { value: string, rowId: string }, thunkAPI) =gt; {  try {  const response = await axios.post('https://localhost:5001/api/.......', { 'selectedCategory': data.value });  return response.data;  } catch (e) {  return thunkAPI.rejectWithValue(e.message);  } }  

);

Спасибо