Я написал действие, которое в настоящее время успешно отправлено. Я вижу сетевой запрос, и он возвращает успешный ответ с запрошенным объектом (ами), но этот объект не возвращает его к действию. Вместо этого он возвращается как неопределенный, и я не могу понять, почему. Что я пропускаю?
МАГАЗИН:
import * as redux from "redux";
import thunk from "redux-thunk";
import {permitCellDesignsReducer, [other reducers her...]}
export const init = () => const reducer = redux.combineReducers({ {permitCellDesigns: permitCellDesignsReducer,...} });
const store = redux.createStore(reducer, redux.applyMiddleware(thunk));
return store;
АКЦИЯ:
export const getPermitCellDesignByFacilityId = id => {
debugger;
return dispatch => {
axios.get("/api/facilities/permits/cellDesign/" + id)
.then(res => { return res.date })
.then(cells => {
dispatch(getFacilityCellDesignsSuccess(cells));
})
}
}
const getFacilityCellDesignsSuccess = cells => {
return {
type: "GET_CELL_DESIGN_LIST",
action: cells
}
}
РЕДУКТОР:
const INITIAL_STATE = {
permitCellDesigns: {}
}
export const permitCellDesignsReducer = (state = INITIAL_STATE.permitCellDesigns, action) => {
debugger;
switch (action.type) {
case "GET_CELL_DESIGN_LIST":
return {
...state,
permitCellDesigns: action.cells
}
default:
return state
}
}
ОТПРАВЛЕННЫЕ ДЕЙСТВИЯ:
import React from "react";
import { connect } from "react-redux";
import { Row, Col, Button } from "react-bootstrap";
import { Link } from "react-router-dom";
import FacilityHeader from '../facilities/FacilityHeader';
import * as actions from "../../actions/FacilityActions";
import * as permits from "../../actions/PermitActions";
import PermitPlanApprovalTable from './permitPlanApproval/PermitPlanApprovalTable';
import PermitCellDesignTable from './permitCellDesign/PermitCellDesignTable';
class PermitInfo extends React.Component {
componentDidMount() {
this.props.dispatch(actions.getFacilityById(this.props.id) );
this.props.dispatch(permits.getPermitPlanApprovalsByFacility (this.props.id));
this.props.dispatch(permits.getPermitCellDesignByFacilityId(this.props.id)
);
}
render() {
debugger;
const { facility, permitCellDesigns } = this.props;
if (!permitCellDesigns) {
return <div>Loading...</div>
}
return (
<div>
<FacilityHeader {...this.props} />
<Row>
<Col>
<h4>Permit/Plan Approvals</h4>
</Col>
<Col>
<Link to={{
pathname: `/facilities/permits/permitplanapproval/${this.props.id}`,
state: { facilityName: facility.facilityName }
}}><Button className="btn btn-light edit">Create</Button></Link>
</Col>
</Row>
<Row>
<Col>
<PermitPlanApprovalTable {...this.props} />
</Col>
</Row>
<Row>
<Col>
<br /><h4>Cell Design Information</h4>
</Col>
<Col>
<Link to={{
pathname: `/facilities/permits/celldesign/${this.props.id}`,
state: { facilityName: facility.facilityName }
}}><Button className="btn btn-light edit">Create</Button></Link>
</Col>
</Row>
<Row>
<Col>
<PermitCellDesignTable {...this.props} />
</Col>
</Row>
</div>
)
}
}
const mapStateToProps = state => ({
facility: state.facility.facility,
permitApprovals: state.permitApprovals.permitApprovals,
permitCellDesigns: state.permitCellDesigns.permitCellDesigns
});
export default connect(mapStateToProps)(PermitInfo);
ОТВЕТ НА ЗАПРОС СЕТИ:
ДЕЙСТВИЕ ВОЗВРАЩАЕТСЯ КАК НЕ УКАЗАНО:
Все остальные реквизиты, которые были отправлены, присутствуют, но не тот, о котором идет речь