Делаем крутой sticky-эффект для слайдера на React

[ViceVersa]

import 'react-id-swiper/lib/styles/css/swiper.css';
2019 год, я не сильно в в этом разбираюсь но это трындец.

[vital_pavlenko]

А что в этом плохого? И какие ваши варианты по импорту стилей?

[ViceVersa]

что произойдет когда стиль переедет выше на каталог? Или вообще в другой каталог? я не знаю как там импорт стилей происходит может там все плохо, но это же работает везде.

[vital_pavlenko]

Это нормальная практика так импортировать библиотечные стили в реакте, больше вариантов особо нет. Чисто теоретически конечно может переехать, но только при обновлении версии пакета

[ViceVersa]

import Swiper from 'react-id-swiper';
import 'react-id-swiper/lib/styles/css/swiper.css';
У меня даже слов нет, как это по разному может работать?

[amakhrov]

Прочитал все 3 ваших комментария в ветке, так и не понял, в чем вы здесь видите проблему.

Насчет возможного переезда файла в другое место — ну, это же не рандомный файл, а часть публичного интерфейса библиотеки, с документированным использованием (https://github.com/kidjp85/react-id-swiper#styling).

[borsalinohat]

У меня начинает ругаться на const container = useRef(null), т.к. useRef нигде не определён. Подсмотрел в вашем готовом проекте — его там нет.

[vital_pavlenko]

Должно быть все нормально. Вы точно его импортировали?

import React, { useRef, useEffect, useState } from 'react';

[lolcoder]

useEffect(() => {
setTimeout(() => {
const parent = container.current.parentElement;
updateOffsetLeft(parent.offsetLeft);
updateWidth(parent.offsetWidth);
}, 0);
}, []); в этом месте плохо всё, зачем тут setTimeout?? Верните из useEffect ()=>false,
Вызовы изменений состояний подряд ведут к повторному рендерингу, используйте объект для хранения.