Wie bekomme ich Daten aus json mit axios?
Ich versuche, mich zu Holen-server-Seite Daten im JSON-format in eine Tabelle mit axios, aber nicht uderstand kann, wie man jedes Feld wie id
, companyInfo
etc.
json :
[
{
"id": 1,
"companyInfo": 1,
"receiptNum": 1,
"receiptSeries": "АА",
"customerName": "Mark",
"customerSurname": "Smith",
"customerMiddleName": "Jk",
"customerPhone": "0845121",
"services": [
2,
16
]
}
]
axios :
store.dispatch((dispatch) => {
dispatch({type: Actions.FETCH_DATA_START})
axios.get("http://localhost:3004/paymentReceipts")
.then((response) => {
dispatch({ type: Actions.RECEIVE_DATA, payload: response })
}).catch((err) => {
dispatch({type: Actions.FETCH_DATA_ERROR, payload: err})
})
reducer :
export const initialState = {
paymentReceipts: []
};
export default handleActions<FetchData>({
[Actions.FETCH_DATA_START]: (state, action) => {
return ;
},
[Actions.FETCH_DATA_ERROR]: (state, action) => {
return;
},
[Actions.RECEIVE_DATA]: (state, action) => {
console.log("DONE WITH STATE");
return {...state,
paymentReceipts : action.payload
}
}
}, initialState)
App
@connect(mapStateToProps, mapDispatchToProps)
export class App extends React.Component<App.Props, App.State> {
constructor() {
super();
}
render() {
console.log("CONTAINER IS ");
console.log(this.props.receiveData);
return (
<div className={style.normal}>
</div>
);
}
}
function mapStateToProps(state: RootState) {
return {
receiveData: state.receiveData
};
}
function mapDispatchToProps(dispatch) {
return {
};
}
dies ist es, was ich von console.log
So, wie Sie an diese Werte aus der JSON?
Du musst angemeldet sein, um einen Kommentar abzugeben.
Erhalten Sie alle Ihre Daten in
response.data
.id = 1, receiptSeries = АА
etcconsole.log(response.data)
Zugriff auf ein einzelnes Attribut innerhalb Ihrer json-Antwort, die Sie können einfach tun:
z.B.:
Abhängig von der Struktur des json ist und wie es formatiert ist (z.B. array von Objekten), müssen Sie Durchlaufen wird.
data
Sie ein Schlüsselwort ausaxios
Bibliothek?response
. Zum Beispiel:response.data
,response.status
,response.headers
etc. Ich bin nicht selbstbewusst genug, zu sagen, dass dies funktioniert in jeder Umgebung und Einrichtung, aber ja, es ist ein "Schlüsselwort" für eineaxios response