Как использовать директиву "v-if" в Vue.js?

@brenna 

Директива "v-if" в Vue.js используется для условного отображения элементов на странице в зависимости от значения булевой переменной или выражения.

Пример использования:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17

  
    Этот текст будет показан, если isShown = true
    Список пуст
  



export default {
  data() {
    return {
      isShown: true,
      items: []
    }
  }
}

В этом примере, если переменная "isShown" равна true, то на странице будет отображен элемент "p", содержащий текст "Этот текст будет показан, если isShown = true". Если же переменная "items" имеет длину 0, на странице будет отображен элемент "span" с текстом "Список пуст".

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