Как скрыть элемент по id используя vue.js?

Пользователь

от lori_jast , в категории: JavaScript , 7 месяцев назад

Как скрыть элемент по id используя vue.js?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от willis.streich , 7 месяцев назад

@lori_jast 

Вы можете скрыть элемент по id в Vue.js, используя динамическое привязывание стилей с помощью свойства v-bind. Например:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
<template>
  <div>
    <div id="element-to-hide" v-bind:style="{ display: displayStyle }"></div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      displayStyle: 'block'
    };
  },
  methods: {
    hideElement() {
      this.displayStyle = 'none';
    }
  }
};
</script>


В этом примере, свойство displayStyle в объекте data отвечает за стиль отображения элемента с id element-to-hide. При вызове метода hideElement, мы изменяем значение displayStyle на 'none', что скрывает элемент.