Задать вопрос
RazerVG
@RazerVG
Full-stack

Почему не могу получить значение из стилей?

В componentDidMount() запускаю функцию для получения стилей активного слайда.

handlerCalculateWidthSlides = () => {
        let slideActive = this._slider.innerSlider.list.querySelector('.slick-current');

        let stylesActiveSlide = getComputedStyle(slideActive);

        console.log(stylesActiveSlide); 
        console.log(stylesActiveSlide.width);
    };


Просматриваю первый консоль лог, высота 900, во втором выводит всю ширину экрана.

Делаю так:

console.log(slideActive);

        // <div data-index="0" className="slick-slide slick-active slick-center slick-current" tabIndex="-1" aria-hidden="false" style="outline: none; width: 900px;">

        console.log(slideActive.style.width)
        
        // 20%


Откуда появляется 20%, не понимаю ?

Использую react-slick.
  • Вопрос задан
  • 83 просмотра
Подписаться 1 Простой Комментировать
Помогут разобраться в теме Все курсы
  • beONmax
    Профессия Frontend разработчик
    12 месяцев
    Далее
  • beONmax
    Профессия Веб разработчик
    10 месяцев
    Далее
  • Нетология
    Frontend-разработка на React
    10 недель
    Далее
Решения вопроса 1
rockon404
@rockon404 Куратор тега React
Frontend Developer
slideActive.style.width - это значение заданное в атрибуте style, а getComputedStyle возвращает вычисленные браузером фактические значения.
Скорей всего библиотека меняет значение width в рантайме. Попробуйте отрыть панель разработчика и посмотреть значения в конкретный момент времени там. Магии там никакой быть не должно.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
ITK academy Нижний Новгород
от 50 000 до 90 000 ₽
ITK academy Воронеж
от 50 000 до 90 000 ₽