React JS中的滑块问题

Question

我正在将this template的html转换为jsx。

我找不到问题，因为控制台中没有错误。我已经在Chrome中使用了React开发人员工具。

以下是react滑块组件中的滑块代码。

import React from 'react';
export default class Slider extends React.Component {
    render() {
        return (
                <section className="section swiper-container swiper-slider swiper-classic bg-gray-2" data-loop="true" data-autoplay="4000" data-simulate-touch="false" data-slide-effect="fade">
                    <div className="swiper-wrapper">
                        <div className="swiper-slide" data-slide-bg="~/ClientApp/public/images/slider-1-slide-1-1920x671.jpg">
                            <div className="container">
                                <div className="swiper-slide-caption">
                                    <h1 data-caption-animate="fadeInUp" data-caption-delay="100">Safe <br /> Betting</h1>
                                        <h4 data-caption-animate="fadeInUp" data-caption-delay="200">With 100% Risk-Free Guarantee</h4><a className="button button-gray-outline" data-caption-animate="fadeInUp" data-caption-delay="300" href={null}>Get started</a>
                                </div>
                            </div>
                        </div>
                    <div className="swiper-slide" data-slide-bg="~/ClientApp/public/images/slider-1-slide-2-1920x671.jpg">
                            <div className="container">
                                <div className="swiper-slide-caption">
                                    <h1 data-caption-animate="fadeInUp" data-caption-delay="100">Easy Bets</h1>
                                    <h4 data-caption-animate="fadeInUp" data-caption-delay="200">With the lowest commissions</h4><a className="button button-gray-outline" data-caption-animate="fadeInUp" data-caption-delay="300" href={null}>Join Us</a>
                                </div>
                            </div>
                        </div>
                        </div>
                        <div className="swiper-button swiper-button-prev"></div>
                        <div className="swiper-button swiper-button-next"></div>
                        <div className="swiper-pagination"></div>
                </section>
        );
    };
}

请帮助我，我被困在这里，无法进一步调试。我会非常感激。