Условие отображение элемента по ширине окна браузера?

Question

[Gregory]

Добрый день. Помогите правильно обратиться:

Хочу, чтобы элемент отображался при определенной ширине окна браузера, пишу:

<div v-if='window.innerWidth > 1200'> smth </div>

Получаю, что window underfined..

Answer 1

[Александр Таратин]

Лучше скрывайте через CSS Media Queries
innerWidth же не будет реактивно заставлять перерисовываться компонент при изменении.
Нужно будет отдельно где-то слушать resize событие на window, и вызывать пересчет.
Короче одни костыли.

Comments

[Gregory]

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

[Александр Таратин]

Gregory, Не знаю какую архитектуру вы используете, но можно примерно так.
Расчитывайте нужные данные (включая информацию о том отображать какой-либо элемент) на resize событие в точке входа приложения или в корневом элементе и прокидывайте в дочерние через свойства компонента.

[Gregory]

Александр Таратин, благодарю за вариант, попробую так и, наверное, еще попробую с помощью классов бутстрапа сделать, посмотрю как удобнее будет. :)