#javascript #react-redux #redux-thunk
Вопрос:
В настоящее время я изучаю redux-thunk и встретил странный синтаксис использования функции, возвращающей функцию.
const App = () => {
const dispatch = useDispatch()
useEffect(() => {
dispatch(anecdoteService.initializeAnecdotes())
}, [dispatch])
который также может быть переписан как
const App = () => {
const dispatch = useDispatch()
useEffect(() => {
anecdoteService.initializeAnecdotes()(dispatch)
}, [dispatch])
Определение initializeAnecdotes-это
const initializeAnecdotes = () => {
return async dispatch => {
const anecdotes = await getAll()
dispatch({
type: 'INIT_ANECDOTES',
data: anecdotes,
})
}
}
Оба они работают (по крайней мере, для меня), и мой вопрос в том, как работает первая версия?
Комментарии:
1. в чем причина размещения
[dispatch]
массива зависимостей?2. Правила реагирующих крючков не допускают этого и продолжают предупреждать, что я должен поместить его в список зависимостей. Вы можете прочитать больше об этом в документах redux
3. Вы можете использовать
useSelector
для загрузки данных.useEffect
сstore.dispatch
зависимостью не совсем правильный подход. На самом деле вuseEffect
мы должны наблюдать объекты уровня компонента, если вы наблюдаете внешние объекты, то ваш компонент будет перезагружаться всякий раз, когда внешний объект изменяется.4. «мой вопрос в том, как работает первая версия?» redux-thunk позволяет отправлять функции, которые будут вызываться: github.com/reduxjs/redux-thunk/blob/… . Если бы вы не использовали redux-thunk, вы бы получили сообщение об ошибке.
5. Спасибо. Я думал, что это новая функция, поэтому я был совершенно сбит с толку
Ответ №1:
redux-thunk позволяет отправлять функции, которые будут вызываться: https://github.com/reduxjs/redux-thunk/blob/master/src/index.js Если бы вы не использовали redux-thunk, вы бы получили сообщение об ошибке.