Answer the question
In order to leave comments, you need to log in
How to properly display data from Json in React?
Whatever I do, the error "TypeError: _client2.default.map is not a function" is thrown.
I still don’t understand how to pull out data from Json.
Please write an example how to get data from Json?
import React, {Component} from 'react';
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import {select2} from '../actions/index';
import data from '../reducers/client2.json';
class ClientsList extends Component {
showList(){
{data.map( function (item, index) {
return (<li key={index}>{item.general.firstName} </li> );} )
}
return this.props.clients.map ((client) =>{
return(
<li onClick={() => this.props.select (client)}
key={client.general.firstName}>{client.general.firstName} </li>
);
});
}
render (){
return (
<ol>
{this.showList()}
</ol>
);
}
}
function mapStateToProps (state){
return {
clients: state.clients
};
}
function matchDispatchToProps (dispatch){
return bindActionCreators({select2: select2}, dispatch)
}
export default connect(mapStateToProps, matchDispatchToProps)(ClientsList);
[
{
"general": {
"firstName": "Liana",
"lastName": "Crooks",
"avatar": "https://s3.amazonaws.com/uifaces/faces/twitter/kevinoh/128.jpg"
},
"job": {
"company": "Ledner, Johnson and Predovic",
"title": "Investor Functionality Coordinator"
},
"contact": {
"email": "[email protected]",
"phone": "(895) 984-0132"
},
"address": {
"street": "1520 Zemlak Cove",
"city": "New Devon",
"zipCode": "42586-7898",
"country": "Guinea-Bissau"
}
},
{
"general": {
"firstName": "Liana",
"lastName": "Crooks",
"avatar": "https://s3.amazonaws.com/uifaces/faces/twitter/kevinoh/128.jpg"
},
"job": {
"company": "Ledner, Johnson and Predovic",
"title": "Investor Functionality Coordinator"
},
"contact": {
"email": "[email protected]",
"phone": "(895) 984-0132"
},
"address": {
"street": "1520 Zemlak Cove",
"city": "New Devon",
"zipCode": "42586-7898",
"country": "Guinea-Bissau"
}
}
]
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question