Проблема c redux

Question

есть запрос на апишку,в нее передаю объект value со свойствами:

export const translateRequest = createAsyncThunk('translate/requestState', (value) => {
    
    const encodedParams = new URLSearchParams();
    encodedParams.append("q", "Hello, world!");
    encodedParams.append("target", "ru");
    encodedParams.append("source", "en");
    const options = {
        method: 'POST',
        url: 'https://deep-translate1.p.rapidapi.com/language/translate/v2',
        headers: {
            'content-type': 'application/json',
            'X-RapidAPI-Key': 'c9c78f6fd2msh549a3cc43e7210ep13b2a8jsn32765281bda6',
            'X-RapidAPI-Host': 'deep-translate1.p.rapidapi.com'
        },
        data: `{"q":"${value.txt}","sourse":"${value.leng}","target":"${value.transTo}"}`
    };
    const request = axios.request(options).then(function (response) {
        return response.data;
    }).catch(function (error) {
        console.error(error);
    });
    return request;
})

свойства я передал с помощью функции ниже, свойство txt - текст который вводится в инпут, leng - язык с которого требуется перевести текст, transTo - язык на который нужно перевести текст. свойства transToи leng имеют свойста по умолчанию, их я храню в редаксе, но при необходимости могу изменить их с помощью кнопок и соответствующих экшенов в редаксе.

const changeValue = useCallback(

        debounce((str) => {
            let obj = {
                txt: str,
                leng: activeLenguage,
                transTo: translateTo
            }
            dispatch(translateRequest(obj))
            console.log(obj)


        }, 400),
        [],
    )

Суть в том что когда я ввожу какой-то текст в инпут, выполняется запрос, и он отрабатывает корректно, но когда я меняю с помощью кнопок свойства leng и transTo, в запрос не передаются обновленные данные, т.е свойства никак не меняются. Хотя в редаксе показывает обновленные переменные.

ниже вставлю код из редакса:

const initialState = {

    translatedText: '', //переведенный текст
    status: 'loading',
    activeLenguage: 'en', // язык, которрый вводится в инпут
    translateTo: 'ru' //язык, на который нужно перевести введенный текст

}
const translateSlice = createSlice({
    name: 'translate',
    initialState,
    reducers: {
        setActivelenguage(state, action) {
            state.activeLenguage = action.payload
        },
        setTranslateLenguage(state, action) {
            state.translateTo = action.payload
        },

    },
    extraReducers: {
        [translateRequest.pending]: (state) => {
            state.status = 'loading'
            state.translatedText = '';
        },
        [translateRequest.fulfilled]: (state, action) => {
            state.status = 'loaded'
            state.translatedText = action.payload.data.translations.translatedText;
        },
        [translateRequest.rejected]: (state) => {
            state.status = 'error'
            state.translatedText = '';
        },

    }
})

БЛОГ НА HUSL

Проблема c redux

Ответы (0 шт):