javascript - 如何在反应js中响应猫头鹰轮播
问题描述
我只想在移动视图中显示一项。但它显示了我在桌面视图中显示的 4 个项目,请帮帮我。
这是我的代码:-
<div className="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab">
<OwlCarousel className="owl-theme hotel-slider tab-slide" id="tab-slider" loop margin={10} items={4} nav>
{Data.shimladetail.map((shimlatour, i) => (
<div className="item no-brdr">
<img src={shimlatour.alltourimg} className="tour-img" />
<div className="tour-cntnt">
<h5 className="tours-heading">{shimlatour.alltourtitle}</h5>
<p className="tour-pera">{shimlatour.alltourdiscription}</p>
</div>
</div>
))}
</OwlCarousel>
</div>
解决方案
尝试使用插件事件,请喜欢onResize
&&onResized
或 && 之类的选项mergeFit
,autoWidth
您可以在下面的链接中找到此选项:
推荐阅读
- python - Python 类型提示 - 可以将字符串分配给 List[int]?
- scala - Spark Submit 命令正在返回缺少的应用程序资源
- c++ - libjpeg 的输出是否总是 RGB(或单色图像的亮度)?
- r - 比较 fable 中产生的 ARIMA 模型的 AICc
- c++ - 保持类成员字段未初始化
- php - Bootstrap 4 w / PHP中的折叠按钮将打开并显示内容但不会折叠
- node.js - 如何获取从reactjs前端接收的nodejs中的数据?
- cuda - 分配 gpu 内存缓冲区时出现 CUDA 无效资源句柄错误
- javascript - 无法将 API 保存为对象
- c# - 无法从 websocket 事件更改 WPF 的属性