Слайдер React Slick не пропускает реквизит - PullRequest
Новая
       15

Слайдер React Slick не пропускает реквизит

0 голосов
/ 27 апреля 2020

У меня есть пара компонентов с Slider. В первом компоненте я получаю реквизит. Но во втором компоненте я не получаю реквизит. Ниже код моих компонентов: 

import React, { Component } from "react";
import Slider from "react-slick";

export default class PartersSlider extends Component {
  constructor(props) {
    super(props);
    this.next = this.next.bind(this);
    this.previous = this.previous.bind(this);
  }
  next() {
    this.slider.slickNext();
  }
    previous() {
    this.slider.slickPrev();
  }
  render() {
    const settings = {
      slidesToShow: 5,
      slidesToScroll: 1,
      arrows: true,
      infinite: true,
      responsive: [{
        breakpoint: 1024,
        settings: {
          slidesToShow: 3,
          slidesToScroll: 3,
          infinite: true,
          dots: true
        }
      }, {
        breakpoint: 600,
        settings: {
          slidesToShow: 2,
          slidesToScroll: 2
        }
      }, {
        breakpoint: 480,
        settings: {
          slidesToShow: 1,
          slidesToScroll: 1
        }
      }]
    }
    return (
      <div>
        <div className="col-md-12 mb-4 d-flex justify-content-between">

        </div>
      </div>
    );
  }
}

В этом примере я ll receive props if i сделаю вот так console.log(this.slider);

И этот второй компонент 

import React, { Component } from "react";
import Slider from "react-slick";

export default class SliderOfComments extends Component {
  constructor(props) {
    super(props);
    this.next = this.next.bind(this);
    this.previous = this.previous.bind(this);
  }
  next() {
    console.log(this.slider);
    // this.slider.slickNext();
  }
  previous() {
    // this.slider.slickPrev();
  }
  render() {
    const settings = {
      arrows: true,
      slidesToShow: 2,
      infinite: true,
      slidesToScroll: 1,
    }
    return (
      <div className="row">
       // code
      </div>
    );
  }
}

И здесь this.slider возвращаясь ко мне undefined

1 Ответ

0 голосов
/ 27 апреля 2020

Я забыл добавить этот код во второй компонент Slider 

ref={c => (this.slider = c)}

PS Прошу прощения

...