react-slick 轮播图自定义上下页按钮

1. 默认显示按钮，ui要求设计的样式。这样示儿的。

。修改如下：

const settings = {
    dots: true,
    infinite: true,
    speed: 500,
    slidesToShow: 1,
    slidesToScroll: 1,
    arrows: true,
};

**重点：**

    修改按钮的背景色：
     .slick-next {
        width: 42px;
        height: 42px;
        right: 24px;
        background-image: url('../../assets/onlineNews/leftArrow.png');
        &::before {
          content: '';
        }
        &:hover {
          background-image:                url("../../assets/onlineNews/leftArrowHover.png");
        }
      }
  这样就修改啦。
<Slider {...settings}>
    {sliderImg.map((item: ImgItem, index: number) => (
      <div
        className={styles.boxSlider}
        onClick={() => {
          history.push({
            pathname: '/online-news/detail',
            query: {
              newsId: item?.newsId,
              type: TextNewsStatus.IMGNEWS,
            },
          });
        }}
      >
        <img src={item.url} alt="" />
        <div className={styles.title}>{item.title}</div>
      </div>
    ))}
</Slider>