1、可能是直接改变state值,解决办法如下
(1)需要重新把state值深拷贝然后return出去
function stores(state = storeState, action) {
switch (action.type) {
case SET_VOYAGESTATUS_INFO:
return Object.assign({}, state, {
voyageStatus: action.voyageStatus
})
default:
return state
}
}
(2)使用immer
import produce from 'immer'
const storeState = {
voyageStatus: {
motive:0,
rest:0,
total:0,
}
}
const stores = (state = storeState, action) =>
produce(state, (draftState) => {
switch (action.type) {
case 'SET_VOYAGESTATUS_INFO':
let motive=0
let rest=0
let total=action.voyageStatus.length
action.voyageStatus.forEach(item=>{
if(item.navistat==0){
motive=motive+1
}else{
rest=rest+1
}
})
draftState.voyageStatus = {
motive,
rest,
total,
}
break
default:
return draftState
}
})
export default stores
2、也有可能是使用的问题
redux的state值有两种获取方法
(1)store.getState()
这种用法在js文件和jsx文件都可以用,但是在jsx文件中用不会重新渲染,所以不建议
import { store } from '@/redux/index'
console.log(store.getState().homeData.voyageStatus)
(2)useSelector
这种用法只能在jsx文件中用,可以重新渲染页面
import { useSelector} from 'react-redux'
const { voyageStatus } = useSelector(state => state.homeData)