Redux useDispatch return an Array React Hooks?

Question

I made Redux using useDispatch in React Hooks but when I call to dispatch the result becomes Array instead of a string.

My code for dispatch

//Variable for dispatch and useSelector
  const profileStore = useSelector(state => state)
  const dispatch = useDispatch()

//Code dispatch
     <TouchableOpacity onPress={() => dispatch(profileAction('Profile Change'))}>
        <Text>helo</Text>
      </TouchableOpacity>

My reducers


import { PROFILE_SAMPLE } from '../types'


export default (state = 'Prev State Profile', { type, payload }) => {
  switch (type) {

  case PROFILE_SAMPLE:
    return { ...state, ...payload }

  default:
    return state
  }
}

My Actions

import {PROFILE_SAMPLE} from '../types'
export const profileAction = (payload) => ({
  type: PROFILE_SAMPLE,
  payload
})

Don't spread the payload in your switch case. Instead only return payload. — Mohit

Shubham Khatri Shubham Khatri · Accepted Answer · 2020-06-24T06:56:30

The issue is that you are spreading your string value and returning an object on updating reducer.

If you want to simply replace the string update it like

case PROFILE_SAMPLE:
    return payload

or if you want to merge the string update it like

case PROFILE_SAMPLE:
    return `${state}${payload}`

Redux useDispatch return an Array React Hooks?

1 Answers