Как пересчитывать высоту элементов в списке, не используя refs?

Question

[Nikname95]

Есть computed

sliderHeight() {
            return this.$refs.slide[this.sliderActive - 1].clientHeight
        }

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

:style="{
                        left: sliderOffsetLeft,
                        height: sliderHeight + 'px'
                    }"

То выдает ошибки.

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

Comments

[0xD34F]

Считаете себя выше правил (6.5, 6.6)?

[Nikname95]

0xD34F, как вы заколебали, какие вы душные, идите со своими правилами куда-нибудь. Нет бы просто ответить. Не лень просто так время своё тратить? Работа наверное в этом и заключается у вас, давать бесполезные ответы и гонять воздух. Баньте, делайте что хотите, но сообщество у вас отвратительное. Выскочки и сплошные зазнайки.

[0xD34F]

Nikname95, да, сообщество отвратительное. Для дегенератов, не желающих хоть немного подумать, прежде чем рот открыть.

Answer 1

[Aetae]

1. computed не будет пересчитаться при обновлении ref'ов или dom-значений. Он работает с реактивными данными.
2. Рефы доступны только после загрузки соответствующих элементов(очевидно), а вы, судя по всему, обращаетесь к ним раньше.

Итого: уберите этот код из computed и поместите в mounted, вручную присваивая значения переменной в data. Не забудьте добавить значения по умолчанию, а также обновлять их при необходимости(по событию resize или ещё какому, способныму повлиять на эти размеры).

P.S. В большинстве случаев то, что вы пытаетесь решить подобным кодом делается на css.