Можно ли поставить обратный вызов для использования useReducer в React Hooks?

Question

const handleFilter = (filter_type, selection) => {
    dispatch({ type: filter_type, option: selection.option })
    filterData()
}

У меня есть useReducer, который обрабатывает выбранный фильтр. Я должен вызвать filterData, который фильтрует данные на основе выбранного фильтра.

Однако, поскольку не гарантируется, что filterData произойдет после отправки, я продолжаю получать отложенное обновление в состоянии.

Я также пытался

const handleFilter = (filter_type, selection) => {
    dispatch({ type: filter_type, option: selection.option })
    .then(filterData())
}

Но это дало мне ошибку Cannot read property 'then' of undefined.

Любая помощь?

РЕДАКТИРОВАТЬ

useEffect(() => {
    const urls = [
        'http://.../v1/profiles',
    ];
    const fetchJson = url => fetch(url, get_options).then(res => res.json());
    Promise.all(urls.map(fetchJson))
        .then(([profile]) => {
            setFilteredTable(profile.result)
        })
        .catch(err => {
            console.log(err)
        });
}, []);

const init_filter = { TITLE: '', LOCATION: '' }

const [filter, dispatch] = useReducer((state, action) => {
    switch (action.type) {
        case 'TITLE':
            return { ...state, TITLE: action.option }
        case 'LOCATION':
            return { ...state, LOCATION: action.option }
        case 'RESET':
            return init_filter
        default:
            return state
    }
}, init_filter)

Answer 1

Мне нужно вызвать filterData, который фильтрует данные на основе выбранного фильтра.

Вы описываете слушателя,вы можете попробовать использовать useEffect hook:

const [filter, dispatch] = useReducer(optionsReducer, initialValue);

useEffect(() => {
  filterData();
}, [filter]);

const handleFilter = (filter_type, selection) => {
  dispatch({ type: filter_type, option: selection.option });
};