Получить выражение / данные v-if как обычный текст в дочернем компоненте

Эй там,

Я пытаюсь создать собственный компонент Vue, который отображается на основе директивы v-if. Я также хочу изменить значение данных директивы (modalStatus) внутри компонента.

<modal v-if="modalStatus"></modal>

Чтобы обновить данные из компонента, я использую метод, похожий на этот.

closeModal () {
   this.$parent.modalStatus = false
}

Проблема в том, что иногда я не знаю название модели данных (modalStatus), может быть что угодно.

Мой вопрос: как я могу получить имя данных / выражения в виде простого текста из модального компонента?

Я планирую использовать что-то подобное для обновления modalStatus

this.$parent['anyName'] = false

Спасибо и будьте в безопасности!

Позже редактировать. Я знаю, как добиться всего вышеперечисленного, используя реквизит или v-модель. Интересно, можно ли использовать строго v-if. Спасибо!


vue.js vuejs3 vuejs2
person thenutz    schedule 22.05.2020    source источник
comment
Вам нужны реквизиты для вашего компонента. vuejs.org/v2/guide/components-props.html   -  person kopz    schedule 22.05.2020

Ответы (1)


arrow_upward
1
arrow_downward

Есть несколько подходов к получению метода или свойства в родительском компоненте от дочернего.

«Способ Vue» - это послать родителю сообщение о закрытии.

Отправить имя как свойство

Родитель

<child modalName='modalStatus' />

Ребенок

this.$parent[this.modalName]=false

Отправить метод

Родитель

<child :close='onClose' />

// component method
onClose(){
   this.modalStatus=false
}

Ребенок

this.close()

Отправить сообщение

Родитель

<child-component @close='modalStatus=false' />

// or call a method
<child-component @close='onClose' />
// component method
onClose(){
  this.modalStatus=false
}

Ребенок

this.$emit('close')
person Steven Spungin    schedule 22.05.2020