I try to use my array from fetch to render few Cards. I have a MyCard component that need information from array that is loaded in the class component. But how do I access this array?
class Customer extends Component {
constructor() {
super();
this.state = {
customers : []
};
componentDidMount() {
fetch(.....etc ...etc..({ customers: json}))
}
render () {
return (
<div>
<CustomerGrid/>
</div> )
}
}
export default Customer;
And here is functional component CustomerGrid where I need to use the array from Customer class. Now I am thinking object oriented. How can I access the array in the class from my function?
import React from 'react';
import Grid from '@material-ui/core/Grid';
import CustomerCard from '../CustomerCard/CustomerCard';
import Customer from '../Customer/Customer';
const CustomerGrid = () => (
<div>
<Grid container>
<Grid item xs={4}>
{this.state.Customer.customers.map(card => (
<div className="cards">
<CustomerCard title={card.CustomerName} custType= {card.CustomerType}></CustomerCard>
</div>
))}
</Grid>
</Grid>
</div>
);
export default CustomerGrid;
Have you try pass it as a prop? ex: <CustomerGrid customers={this.state.customers} />
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.