Debounce API call in redux

Question

Я пытаюсь отправить данные аналитики в google и вам нужно сделать API. У меня есть окно поиска, которое фильтрует список клиентов. Сам поиск дебютирует каждые 300 мс, но я хочу отправлять данные поиска в GA каждые 1000 мс.

Я пытаюсь использовать промежуточное программное обеспечение redux-debounced. Но я заметил, что это только помогает отложить обновление состояния. Я пытаюсь использовать его с redux-thunk. I saw an issue where someone already asked. Я пробовал то, что уже написал там, и это не сработало.

Это то, что мой преобразователь и средние изделия выглядит

let store = createStore(
    reducers, 
    applyMiddleware(logger, createDebounce(), thunkMiddleware) 
); 

export function trackCustomerSearch(key) { 
    const thunk = dispatch => { 
    console.log(key); //This should be only logged only once for 1000ms 
    ... //make api call to GA 
    }; 

    thunk.meta = { 
    debounce: { 
     time: 1000 
    } 
    }; 

    return thunk; 
} 

ли я что-то отсутствует? Или есть альтернативный подход?

Answer 1

Время писать собственное промежуточное ПО. Это не очень сложно, и вы можете сделать так, как хотите.

const debounceInterval = 1000; 
let timerRef = null; 

const updateGAMiddleware = store => next => action => { 
    if (action.type === 'USER_UPDATED_SEARCH_FIELD') { 
    // if my timeout hasn't passed, exit early 
    if (timerRef) return next(action); 

    // send update to GA here 
    // (presumably search field value is in action.data) 

    timerRef = setTimeout(() => { timerRef = null; }, debounceInterval); 
    } 
    return next(action); 
}; 

export default updateGAMiddleware; 

Тогда вы просто импортировать и включить этот промежуточное программное обеспечение, как-так:

... 
import updateGAMiddleware from './<somewhere_sane>'; 
let store = createStore(
    reducers, 
    applyMiddleware(logger, updateGAMiddleware, thunkMiddleware) 
); 

И тогда вы можете направить USER_UPDATED_SEARCH_FIELD действия столько, сколько вы хотите, потому что они будут отправлены только ГА в большинстве каждую секунду.

Я не знаю, требуется ли вам еще одно debuted middleware. Если вы только заботитесь о том, как часто вы отправляете в GA, а не о том, как часто вы обновляете дерево состояний, то, возможно, вы этого не делаете.

Надеюсь, это было то, ради чего вы шли. Если нет, уточните, и я сделаю все, что в моих силах, чтобы помочь. В противном случае, удачи!