React.jsでブートストラップ4のカルーセルコンポーネントを使用するには？

Question

私がカルーセルで作業しようとしていた以下のコードは、=>これは基本的にサイト上で与えられた例です。

エラーは表示されません。アクティブなスライダーは表示されますが、スライディングエフェクトは動作していないようですが、Reactで動作させる方法はわかりません。私はそれを間違っているのですか？それは 'href'に関連していますか？私を助けてください。これは、ナッツ...

import React from 'react'; 
 

 
export default class Slider extends React.Component { 
 
    render() { 
 
     return (
 
      <div id="carouselExampleIndicators" className="carousel slide" data-ride="carousel"> 
 
       <ol className="carousel-indicators"> 
 
        <li data-target="#carouselExampleIndicators" data-slide-to="0" className="active"></li> 
 
        <li data-target="#carouselExampleIndicators" data-slide-to="1"></li> 
 
        <li data-target="#carouselExampleIndicators" data-slide-to="2"></li> 
 
       </ol> 
 
       <div className="carousel-inner" role="listbox"> 
 
        <div className="carousel-item active"> 
 
         <img className="d-block img-fluid" src="resources/img/cd-background-img.jpg" alt="First slide"/> 
 
        </div> 
 
        <div className="carousel-item"> 
 
         <img className="d-block img-fluid" src="resources/img/home-bg.jpg" alt="Second slide"/> 
 
        </div> 
 
        <div className="carousel-item"> 
 
         <img className="d-block img-fluid" src="resources/img/home-bg.jpg" alt="Third slide"/> 
 
        </div> 
 
       </div> 
 
       <a className="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev"> 
 
        <span className="carousel-control-prev-icon" aria-hidden="true"></span> 
 
        <span className="sr-only">Previous</span> 
 
       </a> 
 
       <a className="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next"> 
 
        <span className="carousel-control-next-icon" aria-hidden="true"></span> 
 
        <span className="sr-only">Next</span> 
 
       </a> 
 
      </div> 
 
     ); 
 
    } 
 
}

Answer 1

https://github.com/leandrowd/react-responsive-carouselを試してみて、私を運転です。私はそれを使用して、非常にうまく動作します！