v-Если на теге шаблона компонента

v-Если на теге шаблона компонента

23.11.2017 06:58:44 Просмотров 31 Источник

Из документов:

Поскольку v-if является директивой, она должна быть присоединена к одному элемент. Но что делать, если мы хотим переключить более одного элемента? В этом случай мы можем использовать v-if на элементе, который служит в качестве невидимая обертка. Конечный результат визуализации не будет включать в себя элемент.

Но на моем шаблоне в моем компоненте:

<template v-if="false">
    <div>
       ....
    </div>
</template>

Но компонент все равно отрисовывается.

Я спрашиваю, потому что мне нужен крюк на компоненте, так что если v-if истинно, я могу сделать некоторый код в beforeMountedи beforeDestroyedесли ложно.

У вопроса есть решение - Посмотреть?

https://stackoverflow.com/questions/47459404/v-if-on-a-component-template-tag#comment81873803_47459404
сгруппируйте компоненты, которые вы хотите условно отобразить в родительский компонент, а затем добавьте v-if в родительский компонент

Ответы - v-Если на теге шаблона компонента / v-if on a component template tag

Lucas Katayama

23.11.2017 11:54:03

Если я не понял, что ты делаешь...

Вы ставите v-if int в тег шаблона ina .vueфайл правильно? Подобный этому

// component.vue
<template v-if="false">
   <div>
     My Component
   </div>
</template>
<script>
export default {
     name: 'my-component'
};
</script>
<styles>
</styles>

Так ведь?

Если да, то вы делаете это неправильно.

В шаблоне есть тег для webpack Vue Loader для загрузки шаблона компонента.

Так ifдолжен идти внутри тега шаблона.

// component.vue
<template>
   <div v-if="false">
     My Component
   </div>
</template>
<script>
export default {
     name: 'my-component'
};
</script>
<styles>
</styles>

Если вам нужно "спрятать" несколько элементов, просто инкапсулируйте их в другой div.

https://stackoverflow.com/questions/47459404/v-if-on-a-component-template-tag/47463143#comment105125444_47463143
условное if может быть использовано в шаблоне
Arthur Kuznetsov

25.10.2018 11:25:56

Как сказал Лукас Катаяма, вы не можете использовать v-ifвнутри SFC, но другой способ скрыть ваш компонент-использовать v-ifна этом компоненте в его родительском компоненте.

Закрыть X