reducer возвращает null (реагирует на redux с маршрутизатором и параметрами) - PullRequest
Новая
       41

reducer возвращает null (реагирует на redux с маршрутизатором и параметрами)

0 голосов
/ 16 июня 2020

у меня есть простой магазин, где у меня есть getall и getbyid на редукторе 

const initstate = {
   allobjects: [],
   object: {}
}

switch (action.type) {
    case Constant.GET_OBJECT:
      const object = state.allobjects.find(o => o.id === action.payload)
      return {
         ...state,
         object
      }
    case Constant.GET_ALL:
      const allobjects = action.payload
      return {
          ...state,
          allobjects
      }
}

у меня есть два компонента: 

// ObjectsList

export const ObjectList = ({ objects}) => {

  useEffect(() => {
      // execute action to getobjects
    }, []) 
  return (
    <>
      {
        objects.map(o => > { <div>o.name</div>})
      }
    </>
  )
}

// mapstatetoprops return objects from init state
// mapdispatchtoprops that calls getobjects

export default connect(ObjectsList);


// Object

const Object = () => {
   const { obj_id } = userParams()
   useEffect(() => {
      // execute action to getobjbyid
    }, [])

   return (<div>selected {obj.name}</div>)
}

// mapstatetoprops return obj from init state
// mapdispatchtoprops that calls getobjectbyid

export connect(Object);

И затем я использую свой реактивный маршрутизатор dom для переключаться между этими двумя компонентами на корпусе. 

const Container = () => {
  return (
     <>
         <Router exact path='/' component={ObjectsList} />
         <Router exact path='/:obj_id' component={Object} />
     </>
  )
}

У меня был бы список объектов, если бы я добрался до пути '/', но затем, если бы я попал на путь '/: obj_id', он установил бы свойство моих объектов (из init состояние) в null / []. Единственный способ, которым он не был бы равен нулю, - это если я посещаю маршрут '/' и имею ссылку в приложении для запуска маршрута '/: obj_id'.

Мой вопрос: как лучше всего справиться с прямым переходом к маршруту / obj_id без необходимости загружать список объектов из компонента objectslist?

1 Ответ

0 голосов
/ 16 июня 2020

Во-первых, неправильно оформлена подписка на redux. фактический синтаксис: connect()(Object)

второй синтаксис редуктора неверен, правильный синтаксис: 

YourReducer = (state = initialState, { type, data }) => {
      switch (action.type) {
         case Constant.GET_OBJECT:
           const object = state.allobjects.find(o => o.id === action.payload)
           return {
              ...state,
              object
           }
         case Constant.GET_ALL:
           const allobjects = action.payload
           return {
             ...state,
             allobjects
           }
         default: return state
     }
}

третий:

используйте combReducer, который создает состояние редукции, правильный синтаксис: 

return combineReducer({
   myState: YourReducer
})

После того, как все вышеперечисленное будет выполнено, вы можете использовать преимущество redux.

...