Как сделать так, чтобы если пользователь имеет только один товар, то слайдер должен отключатся?

Question

[Daniil]

Я подключил библиотеку для создания карусели https://www.npmjs.com/package/react-multi-carousel в React. Всё настроил, всё работает, но есть недочёт. Карусель нужна для просмотра в его кабинете какое устройство человек купил. Вопрос - как сделать так, чтобы если пользователь имеет только один товар, то слайдер должен отключатся, можно и чтобы просто стрелки убирались в слайдере.

<Carousel 
            responsive={carouselSetting}
            infinite={true}
            transitionDuration={299}
            customLeftArrow={<customLeftArrow />}
            customRightArrow={<CustomRightArrow />}
            className="list__products carousel carousel-products mb-sm-2 mb-1"
            >
           {this.props.userLoans.map((item, i) =>
          <div key={i}>
            <Link to={`/cabinet/${item.loan_guid}`}>
              <div className="d-flex" >
                <div className="mr-1"><img src={process.env.PUBLIC_URL + '/data/product-50.png'} alt="product-50" />
                </div>
                <div>
                  <h4 className="fz16 text-medium">{item.phone_vendor} <br />{item.phone_model}</h4>
                  <div className="row-param d-flex"><span className="mr-1">{item.phone_color}</span><span className="text-nowrap">{item.phone_memory_size} ГБ</span></div>
                </div>
              </div>
            </Link>
          </div>
           )}

        </Carousel>

Comments

[Kovalsky]

Ну показывайте слайдер только если элементов больше чем один или вешайте на слайдер соответствующий класс чтобы он убирал стрелки,

Answer 1

[Neuro]

if(!userLoans.length) {

}