@Serge999111

Как скрыть блок в одном компоненте по клику по кнопке в другом компоненте vue?

Добрый день.

Подскажите. Есть кнопка в компоненте меню. Как при клике на кнопку, скрыть div, который находится в другом компоненте?

Оба компонента регистрируются локально на одной странице.

Спасибо.
  • Вопрос задан
  • 49 просмотров
Решения вопроса 1
@dGololobov
начинающий
родительский компонент:
<component-one v-on:click-some-button="hideBlockkInOtherComponent"></component-one>
   <component-two ref="othercomponent"></component-two>

methods: {
    hideBlockkInOtherComponent () {
         this.$refs.othercomponent.hideBlock();
    }
}


component-one:
<div><button v-on:click="sendClickForParent">click</button></div>

methods: {
    sendClickForParent () {
         this.$emit('click-some-button');
    }
}


component-two:
<div>
       <div v-if="showBlock">my block</div>
   </div>

data () {
    return {
        showBlock: true,
    };
},
methods: {
    hideBlock () {
         this.showBlock = false;
    }
}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы