React-slick - 在多个项目轮播中有条件地隐藏点

Question

我有新的反应，所以也许这个问题有点基础。我有一个多项旋转木马。 Dots当前设置为true，但是当它使用4张幻灯片动态加载时，设置为：

slidesToShow：4，slidesToScroll：4，仍然显示平板电脑的点数（最大宽度：768px）......重点是我想隐藏它。

有没有办法添加一个条件，所以当幻灯片数为4时，响应宽度768px隐藏点？

这是一个例子：https://codepen.io/fauslg/pen/wXmWxL

this.settings = {
      dots: true,
      infinite: false,
      speed: 500,
      slidesToShow: 4,
      slidesToScroll: 4,
      arrows: false,
      responsive:

Answer 1

您可以更改SliderComponent中的代码并添加：

    constructor(props){
.....
        let {settings} = this.props;

            for(let i = 0; i<settings.response.length();i++)

    {

    if(response[i].breakpoint == 768 && 

    response[i].settings.slidesToShow==4){

    settings.dots= false;

    break;

    }

    }


            ......
            .....
            }

如果响应数组总是具有相同的结构（你知道宽度768总是第二个条目）：

    constructor(props){
.......
            let {settings} = this.props;
        settings.dots= (
      response[1].settings.slidesToShow==4)? false : true;
        ....}