ReactJS Slider旋转木马组件

Posted 2021-04-12

下面是一些代码示例，我发现了这个：

<Slider ref = {c => (this.slider = c)} {...this.settings}>
        {
          //custom component for slider content
        }
      </Slider>

我不明白ref = {c => (this.slider = c)} {...this.settings}的含义是什么。这是做什么的？ this.settings是一个具有各种属性的对象，如arrows:false，mobilefirst:true。但我不知道ref等的这种结构，并且在这个例子中没有解释。 有这个指南吗？

答案

这段代码创建了对元素的引用，以便稍后使用它 - 它存储在类中，可以使用this.slider访问，也可以作为prop传递给子元素。例如，它可以像常规html元素一样用于设置焦点：this.slider.focus（）。你可以在这里阅读更多关于回调参考：https://reactjs.org/docs/refs-and-the-dom.html#callback-refs