Как перейти от избыточного «подключения» к хукам «useDispatch» и «useSelector»? - PullRequest
1 голос
/ 08 июля 2019

Я не уверен, как перейти от избыточного к хукам, насколько это возможно при отправке действий и получении состояния из хранилища, поскольку нет официальных руководств. Это правильно?

import React, { useEffect } from 'react'
import { useSelector, useDispatch } from 'react-redux'
import { createSelector } from 'reselect'
import { actions, selectors } from 'data'
import TemplateComponent from './template'

const areaSelectors = selectors.components.areas
const modalActions = actions.modals

const selectAllAreas = createSelector(
  areaSelectors.getAdminAreas,
  areaSelectors.getGuestAreas,
  (adminAreas, guestAreas) => adminAreas.concat(guestAreas)
)

const ContainerComponent = () => {
  const dispatch = useDispatch()
  const allAreas = useSelector(selectAllAreas)
  const adminAreas = useSelector(areaSelectors.getAdminAreas)

  useEffect(() => {
    dispatch(
      modalActions.showModal('AreaAddGuest')
    )
  }, [dispatch])

  const passedProps = {
    allAreas,
    adminAreas
  }

  return <TemplateComponent {...passedProps} />
}

export default ContainerComponent

1 Ответ

0 голосов
/ 08 июля 2019

Выбранная часть кажется правильной,

часть с отправкой не имеет.

Я не уверен, что вы пытаетесь сделать с этим эффектом, но использовать Диспетчер просто. Он предоставит вам функцию отправки, которую вы затем сможете использовать для выполнения dispatch(mdalActions.showModal('AreaAddGuest')), когда вам это нужно.

Часть }, [dispatch]) в useEffect просто говорит, что useEffect следует запускать всякий раз, когда изменяется функция диспетчеризации, что, вероятно, никогда, но это также сильно зависит от реализации. Это почти наверняка неправильно.

Если можете, опубликуйте код перед добавлением хуков, чтобы увидеть, что было в оригинале.

Также обратите внимание, что нет необходимости переписывать код для использования хуков. Если классы когда-либо станут устаревшими, это, скорее всего, будет далеко в будущем.

...