问题标签 [react-slick]

我如何将我的轮播点设计成这样？

这就是我现在所拥有的。

这是我的风格。

HTML

我遇到了 react-slick 的问题。主题行可能没有意义，但我将尝试详细解释该场景。请参阅此示例小提琴以查看实际问题。

在此演示中，滑块最初显示 20 张幻灯片（每页 3 张）。这个想法是，如果您单击按钮，它将生成一个随机数，这将是新的幻灯片数。代码相当简单且不言自明。

要重现该问题， 1. 继续单击下一步箭头，直到到达最后一张幻灯片。
2. 单击“单击”按钮以生成新的随机幻灯片数。

我的期望是幻灯片将返回到第一张幻灯片，但不会停留在以前的页面上。更糟糕的是，如果新的幻灯片数量低于之前的数量，用户将看到没有幻灯片的空白页面。单击上一个错误时，他/她可以转到上一个幻灯片，一切正常，但初始显示破坏了用户体验。

我是否缺少在代码中添加的内容，或者这是一个错误？

谢谢，阿比。

我正在为 React JS 使用 React-Slick 滑块组件，但我收到一个警告，每个数组都必须有一个唯一的键。

我在滑块组件的设置中有一个数组。设置是：

我使用这些设置的滑块组件是：

我如何映射这些设置以给他们一个密钥？

所以如果这是个愚蠢的问题，请原谅我。

我正在为我的项目使用 React Carousel 组件（react-slick）。我想要实现的是，在这个块内我想使用我的模块“ CarouselSlide ”。

CarouselSlide 是我的反应模块显示单个轮播幻灯片。

是否可以使用这种方式，还是我必须编辑“ react-slick ”组件自己的源代码？

我正在尝试使用 react-slick 在轮播中显示我的自定义组件：

但似乎 react-slick 不支持这种使用方式。

JsFiddle 演示

https://jsfiddle.net/jqLzpewm/

我们在我们的应用程序中使用 React-Slick 来实现 Carousel 效果。滑块中的内容是动态的，轮播项目的长度可以在 4 到 20 之间。

问题是，即使所有内容的宽度都小于滑块轨道的宽度，左右箭头仍然有效。

在这种情况下隐藏或禁用这些箭头的解决方案/解决方法是什么？

我尝试使用动态子级进行 react-slick，但它不能正常工作，第一次渲染时的高度大约为 176 像素，但如果我尝试调整浏览器的大小，那么它可以工作并且高度变为 514 像素。我想可能是我强迫我的组件再渲染一次，但它没有用。我试图复制这个问题，但在那里遇到了一些其他问题。

看看小提琴

我正在为轮播使用一个名为 react-slick 的插件。我试图实现一个具有动态幻灯片的轮播，但是当它呈现时，它似乎并没有初始化每张幻灯片。是因为滑块在孩子之前初始化了吗？

this.extractData 基本上是获取 json 对象

测试布局

任何帮助将非常感激。谢谢

更新 - 找到修复https://github.com/akiran/react-slick/issues/328

我正在使用带有 Green Sock 动画工具的 react-slick carousel，并且我已经让滑块和动画工作了。现在的问题是当动画在幻灯片上结束时调用 slickNext 方法。无论我是否使用 refs，我都会不断收到此错误（但我的“测试”正在运行并显示在控制台中）。这种方法的 github 文档有点贫乏和混乱，我还没有找到任何类似的情况可以作为参考。如何访问此方法？

我正在尝试在我的 React 项目中使用 react-slick。当我尝试导入它时

我收到这个错误

还有谁有相同的问题吗 ？

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

还为 css 和字体安装 slick-carousel

反应 V“反应@^15.4.1”

NPM 安装结果