React-Slick旋转木马 - 禁用箭头

问题描述：

我们在应用程序中使用React-Slick作为旋转木马效果。滑块中的内容是动态的，轮播项目的长度可以在4到20之间。React-Slick旋转木马 - 禁用箭头

问题是，即使所有内容的宽度小于滑块轨道的宽度，右箭头工作。

什么是溶液/变通方法来隐藏或在这样的情况下禁用这些箭头？

不要他们甚至可以禁用？如果你提供你的代码会很好，所以我们可以重现这个问题。 –

答

使用CSS和JS一起修改基于数据内容的箭头可见性。

我没有代表尚未将其作为评论发布，但应该做的伎俩。

答

请看看他们的文档。他们有一个选项禁用它。

https://github.com/akiran/react-slick

<ReactSlick arrows={false}>...</ReactSlick>

答

Below is my code and to disable arrows just make arrows as false in settings : 

class SimpleSlider extends React.Component { 
render() { 
     var settings = { 
     dots: true, 
     autoplay: true, 
     arrows: false 
    }; 

    return (
     <Slider {...settings}> 
      <div><img src='../../src/assets/1.jpg' /></div> 
      <div><img src='../../src/assets/2.jpg' /></div> 
      <div><img src='../../src/assets/3.jpg' /></div> 
      <div><img src='../../src/assets/4.jpg' /></div> 
     </Slider> 
    ); 
} 
} 

Some more configurable properties can be found here : https://www.npmjs.com/package/react-slick

React-Slick旋转木马 - 禁用箭头

相关推荐