失败的道具类型:道具"address"在"UpdateAddress"中标记为必

Question

这里我得到的是reduxdevtools中的地址数组，而不是地址对象在后端，api可以很好地与poster配合使用，并获得所需的结果，但是对于前端来说，它不起作用。正在获取类似--TypeError:Cannot的错误析构函数"nextOps.address"的属性"id"，因为它未定义。

addressReducers.js:

const initialState={
addresses:[],
address:{}
};
export default function(state=initialState,action){
switch(action.type){

case GET_ADDRESS :
return{
...state,
address:action.payload
};

**addressAction.js:**
export const getAddress=(id,history)=> async dispatch => 
{
try{
const res= axios.get(`/api/user/address/${id}`)
dispatch({
type:GET_ADDRESS,
payload:res.data
});
}catch(error){
history.push("/dashboard")
}
};
**UpdateAddress.js:**
class UpdateAddress extends Component{
constructor(){
super();
this.state={
id: "",
addressLine1:"" ,
addressLine2:"" ,
userName: "",
contactNo: "",
postalCode: "",
acceptanceCriteria: "",
uniqueId: "",
errors:{}
};
this.onChange=this.onChange.bind(this);
this.onSubmit=this.onSubmit.bind(this);
}
componentWillReceiveProps(nextProps){
if(nextProps.errors){
this.setState({errors:nextProps.errors})
}
const{
id ,
addressLine1 ,
addressLine2 ,
userName ,
contactNo ,
postalCode ,
acceptanceCriteria ,
uniqueId 
}=nextProps.address
this.setState({
id ,
addressLine1 ,
addressLine2 ,
userName ,
contactNo ,
postalCode ,
acceptanceCriteria ,
uniqueId
});
}
componentDidMount() {
//const {address}= this.state;
const {id}=this.props.match.params;
this.props.getAddress(id, this.props.history)
}
onChange(e){
this.setState({[e.target.name]:e.target.value});
}
onSubmit(e){
e.preventDefault()
const updateAddress={
"id": this.state.id,
"addressLine1": this.state.addressLine1,
"addressLine2": this.state.addressLine2,
"userName": this.state.userName,
"contactNo": this.state.contactNo,
"postalCode": this.state.postalCode,
"acceptanceCriteria": 
this.state.acceptanceCriteria,
"uniqueId": this.state.uniqueId
};

this.props.createAddress(updateAddress,this.props.history);
}
render(){
const {errors}=this.state;
return (
)
}
UpdateAddress.propTypes={
getAddress:PropTypes.func.isRequired,
createAddress:PropTypes.func.isRequired,
address:PropTypes.object.isRequired,
errors:PropTypes.object.isRequired
}
const  mapStateToProps = state =>({
address:state.address.address,
errors:state.errors
});
export default connect(mapStateToProps, 
{getAddress,createAddress})(UpdateAddress);
//console.error

Answer 1

检查addressAction.js中的getAddress函数，需要返回一个异步函数。

export const getAddress= (id,history)=>  return async dispatch => {

try {
const res= axios.get(`/api/user/address/${id}`)
dispatch({
type:GET_ADDRESS,
payload:res.data
});
} catch(error){
history.push("/dashboard")
}
};
}