为什么我的滑动按钮在 reactjs 代码中不可见且不起作用

问：

这是使用刷卡器的 ROW 滑块的代码，第二个代码是按钮，但仍然按钮根本没有显示在屏幕上，并且无法正常工作

我可以看到 inspect 元素中的按钮，但我在屏幕上看不到 in，当我单击它时，它不起作用。而且我还可以看到 Swiper 的默认导航按钮。我希望我的按钮出现，而 Swiper 的默认导航按钮不出现

行.js代码

//some code

import { Swiper, SwiperSlide, useSwiper } from 'swiper/react';
import { Navigation } from 'swiper/modules';
import '../../node_modules/swiper/swiper-bundle.css';
import SwiperButton from './SwiperButton';

function Row({ title, fetchUrl }) {
  const [anime, setAnime] = useState([]);
  const swiper = useSwiper();

 //some more code
enter code here
  return (
    <div className='row'>
      <h1>{title}</h1>
      <div className='row__posters' data-aos='slide-right' data-aos-once='true'>
        <Swiper
          modules={[Navigation]}
          slidesPerView={7}
          navigation
          onSwiper={(swiper) => console.log(swiper)}
          onSlideChange={() => console.log('slide change')}
        >
          {anime.map(
            (anime) =>
              anime.animeImg && (
                <SwiperSlide>
                  <Link to={`/info/${anime.animeId}`}>
                    <div className='row__poster-container'>
                      <img
                        className={`row__poster`}
                        key={anime.id}
                        src={anime.animeImg}
                      ></img>
                      {
                        <p className='overlay-text'>
                          {truncate(`${anime.animeTitle}`, 20)}
                        </p>
                      }
                    </div>
                  </Link>
                </SwiperSlide>
              )
          )}
          <SwiperButton />
        </Swiper>
      </div>
    </div>
  );
}

export default Row;

这是SwiperButton.js的代码

import React from 'react';
import { useSwiper } from 'swiper/react';

export default function SwiperButton() {
  const swiper = useSwiper();
  return (
    <div>
      <button onClick={() => swiper.slidePrev()}>Prev</button>
      <button onClick={() => swiper.slideNext()}>Next</button>
    </div>
  );
}