M
M
miks20202019-06-17 11:06:36
JavaScript
miks2020, 2019-06-17 11:06:36

How to loop through api in react component?

Please help, I need to loop inside the component and return the components in the Car component, respectively, I need to get data from the server (an array of objects), I can’t use the api in general. the code:
<Cars data={this.state.items} />
<Route path={"/cars/" + item.id} component={Car}/>

const columns = [
  {
    title: 'Наименование авто',
    dataIndex: 'carname',
    key: '1',
  },
  {
    title: 'Автомобили',
    dataIndex: 'car',
    key: '2',
     render: (name, id) => <Link to={'/cars/'+id.key}>{name}</Link>,
  },
  {
    title: 'Дата',
    dataIndex: 'date',
    key: '3',
  }
];
const Cars = () => (
  <Switch>
    <Route path={"/cars/"+???} component={Car}/>
  </Switch>
)
const Car = () => {
  return (
    <div>
      <img src={???} width={"150px"}/>
      <h3>{имя}</h3>
      <Link to={'/'}><b>BACK</b></Link>
    </div>
  )
}
class ContentFeed extends React.Component {
  constructor(){
    super()
    this.state = {
      items:[]
    }	 
  }	
  componentDidMount(){
    this.getItems();
  }
  getItems(){
    fetch(url)
      .then(response => response.json())
      .then(response => this.setState({items: response}))
  }
  render(){
    return (
      <Router history={history}>
        <Table columns={columns} dataSource={this.state.items}/>
        <Сars />
      </Router>
    );
  }
}

export default ContentFeed;

Answer the question

In order to leave comments, you need to log in

1 answer(s)
A
Anton Spirin, 2019-06-17
@miks2020

1. To learn how to display lists read:
Lists and Keys
2. You only need one route with a parameter. Read:
Responsive routes
3.

i can't use the api in general

"I can't" is it impossible, no access or I don't know how? If the latter, then:
AJAX and calling the API (you can use the useEffect hook here)
Using the effect hook
Using the Axios Fetch API
: Example

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question