#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); } }
);
Спасибо