@adizh

Как сделать слайдер основываясь на данных из json?

Есть данные json формата,нужно сделать слайдер основываясь на этих данных.
Папка сервер,где лежат данные:
const express = require('express');
 server.get('/api/v1/startup', (req, res) => {
    res.send(
       JSON.stringify(
        [
        {"startup_id":2,"startup_name":"Mangoswap","startup_descr":"The mango swap coin is the future for crypto currency, it wllit. Exercitation veniam consequat sunt nostrud amet. Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint. Velit officia  enim 
        {"startup_id":11,"startup_name":"Mangoswap","startup_descr":"The mango swap coin is the future for crypto currency, it will allow user share and tansact over defi networks with less fees.","startup_price":"$200,000/$400,000","startup_foundation":"Founded 17th May, 2015","website":"mangoswap.com","location":"San Francisco, California","teamSize":"100-500 people","founder":"Edmund Kitan","coFounder":"Olarenwaju Cesar","headGrowth":"Uzo Amanda","headProduct":"Dtation v"},
      
      
      ]
       )
    )
  
}); 
server.listen(port);
console.log(`serving on http://localhost:${port}`)


компонент,в котором нужно отобразить эти слайды с данными:
{startupData.map((s)=>(
        <MDBContainer>
          <MDBCarousel
            activeItem={111}
            length={1}
            showControls={true}
            showIndicators={true}
            className="z-depth-3"
            slide
          >
            <MDBCarouselInner>
              <MDBCarouselItem itemId={s.startup_id}>
              
               
      <div key={s.startip_id} className='startup_card'>
      <div className="card_header">
          <img src={image} alt="" />
          <div className="card_name">{s.startup_name}</div>
      </div>
<div className="card_descr">{s.startup_descr}</div>
<div className="card_info">
<div className="card_fund">Fund raise</div>
<div className="card_progress">50% complete</div>
</div>
<div className="card_price">{s.startup_price}</div>
<div className="card_range">
    <img src={range} alt="" />
</div>
<div className="card_button">
<button className='btn_fund'>Fund Startup</button>
{/* <Link className='link_startup'>Learn more</Link> */}
</div>

  </div>
              
              </MDBCarouselItem>
              
            </MDBCarouselInner>
          </MDBCarousel>
        </MDBContainer>
  • Вопрос задан
  • 107 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы