Redux не обновляет состояние - PullRequest
0 голосов
/ 17 апреля 2019

У меня проблема с Redux, который не обновляет состояние.Компонент получает правильное начальное состояние.Действие отправляется правильно, данные выбираются правильно и доступны в полезной нагрузке действия внутри редуктора.Редуктор работает, выбран правильный случай в переключателе.Просто новое состояние не появляется в компоненте.У меня есть три других компонента, где он работает просто отлично, только этот взламывает.

компонент

import fetchLinksPage from '../state/links/actions'
...

let Links = ({linksPageLoaded, linksPage, fetchLinksPage}) => {
  useEffect( () => {
      if(!linksPageLoaded) {
        fetchLinksPage()
        console.log(linksPage)
      }
  },[])

  return ( ... )
}

const mapStateToProps = ({linksPageReducer}) => {
  return linksPageReducer
}

const mapDispatchToProps = dispatch => {
  return {
    fetchLinksPage: () => dispatch(fetchLinksPage())
  }
}

Links = connect(mapStateToProps, mapDispatchToProps)(Links)

действия

// action types
export const GET_LINKS_PAGE = 'GETLINKSPAGE'
export const LINKS_PAGE_LOADED = 'LINKSPAGELOADED'
export const LINKS_PAGE_ERROR = 'LINKSPAGEERROR'

// action creators
export const getLinksPage = () => {
  return {
    type: GET_LINKS_PAGE
  }
}
export const linksPageLoaded = (data) => {
  return {
    type: LINKS_PAGE_LOADED,
    payload: data
  }
}

export const linksPageError = (error) => {
  return {
    type: LINKS_PAGE_ERROR,
    payload: error
  }
}

const fetchLinksPage = () => {
  return dispatch => {
    dispatch(getLinksPage())
    fetch('http://portfolio.adamzajac.info/_/items/links?fields=*,logo.*.*')
      .then(response => response.json())
      .then(data => {
        dispatch(linksPageLoaded(data.data))
      })
      .catch( error => {
        dispatch(linksPageError(error))
      })

  }
}

export default fetchLinksPage

редуктор

import * as actions from './actions.js'

const linksPageReducer = (state={}, action) => {
  switch (action.type) {
    case actions.GET_LINKS_PAGE:
      return { ...state, linksPageLoading: true }
    case actions.LINKS_PAGE_LOADED:
      //console.log('update state')
      return { ...state, linksPage: action.payload, linksPageLoading: false, linksPageLoaded: true }
    case actions.LINKS_PAGE_ERROR:
      return { ...state, linksPageError: action.payload, linksPageLoading: false}
    default:
      return { ...state, linksPageLoading: false, linksPageLoaded: false, linksPage:[], linksPageError:''}
  }
}

export default linksPageReducer

магазин

import aboutPageReducer from './state/about/reducer'
import projectsPageReducer from './state/projects/reducer'
import skillsPageReducer from './state/skills/reducer'
import linksPageReducer from './state/links/reducer'

const rootReducer = combineReducers({
  aboutPageReducer,
  projectsPageReducer,
  skillsPageReducer,
  linksPageReducer
})

const store = createStore(
  rootReducer,
  applyMiddleware(thunk)
)
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...