[英]error TypeError: Cannot convert undefined or null to object
i have this error with axios, the json load fine, but its a problem with the render 我在axios上遇到此错误,json加载正常,但渲染存在问题
actions.js: actions.js:
export const getUser = (callback)=>{
return function(dispatch){
dispatch({type: 'FETCH_GET_USER_REQUEST'});
axios.get('https://jsonplaceholder.typicode.com/users')
.then((response)=>{
dispatch({type:'FETCH_GET_USER_SUCCES', payload:response.data});
if (typeof callback === 'function') {
callback(null, response.data)
}
})
}
}
reducerUser.js reducerUser.js
export const getUserReducer = (state=[], action) =>{
switch(action.type){
case 'FETCH_GET_USER_REQUEST':
return state;
case 'FETCH_GET_USER_FAILURE':
return state;
case 'FETCH_GET_USER_SUCCES':
return [...action.payload.data];
default:
return state;
}
}
container.jsx container.jsx
class GetUserContainer extends Component{
componentDidMount(){
this.props.getUser();
}
render(){
return(
<GetUserComponent allUser={this.props.allUser} />
)
}
}
function mapStateToProps(store){
return{
allUser:store.allUser
}
}
function matchDispatchToProps(dispatch){
return bindActionCreators({
getUser:getUser
}, dispatch)
}
store.js store.js
const store = createStore(
reducers,
applyMiddleware(thunk, logger())
);
Looking at your console output your, your issue is most likely in your reducer when the FETCH_GET_USER_SUCCES
action is hit. 查看您的控制台输出,当您FETCH_GET_USER_SUCCES
操作时,您的减速器很可能是您的问题。
You are returning this: [...action.payload.data];
您将返回以下内容: [...action.payload.data];
. 。 Try logging your payload, there may not be a data object on the payload hence the converting undefined or null to object error. 尝试记录您的有效负载,有效负载上可能没有数据对象,因此将未定义或null转换为对象错误。 I am betting you just need to return: [...action.payload];
我敢打赌,您只需要返回: [...action.payload];
From the error stack you can see the error is called from getUserReducer
in your code, and then in _toConsumableArray
which is a helper method created by babel when transpiling spread operator to es5. 从错误堆栈中,您可以看到在代码中先从getUserReducer
调用了错误,然后在_toConsumableArray
中_toConsumableArray
该方法,该方法是babel在将spread operator转换为es5时创建的辅助方法。
Like @ಠ_ಠ said hinted at, you get the error because action.payload.data
is not an object, in which case applying the spread operator will fail. 就像@ಠ_ಠ暗示的那样,您会收到错误,因为action.payload.data
不是对象,在这种情况下,应用传播运算符将失败。 ( [...action.payload.data]
) ( [...action.payload.data]
)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.