Vue 2.0 - ребенок общается с родителем - PullRequest
0 голосов
/ 12 ноября 2018

Кажется, я не могу заставить родителя действовать на уровне ребенка.Вот мой код:

HTML:

<ul>
    <!-- Tablet Parent -->
    <li :closeMySibling="closeMyChild">
        <div class="inner-category">
            <ul>
                <!-- Tablet Children / Desktop Parents  -->
                <li v-for="(r, idx) in routes"
                    @mouseover="selected = idx, closeSibling(idx)"></li>
            </ul>
        </div>
    </li>
</ul>

Сценарий:

   closeSibling: function(idx) {
      // message below is showing in console
     console.log("I am emitting " + idx)
     this.$emit('closeMySibling', idx)
    },
    closeChild: function() {
     // message below **IS NOT** showing in console
     console.log('closing my child')
     if (idx !==0){
       (this.$refs['menuItem0'][0]).classList.remove("active")                        
                    }         
    }

Я пытаюсь сохранитьэто просто;Я удалил много кода.В основном 4 ребенка принадлежат одному из родителей.При наведении на родительский элемент заголовок 1-го дочернего элемента (индекс 0) открывается с информацией.

Когда любой из дочерних элементов «наведен», он отправляет событие родителю, сначала идентифицируя свой индекс и запрашиваяих брат и сестра будут закрыты.

Родитель получает событие, и пока ребенок, запрашивающий закрытие, не является индексом 0, родитель будет закрывать дочерний индекс 0.

Дочерние объекты излучают правильноно родитель не отвечает на emit.

Может кто-нибудь указать на мою ошибку.

Спасибо

ОБНОВЛЕНИЕ:

Изменен родительский элемент на это =>: closeMySibling = "closeMyChild ()"

Изменен дочерний элемент на этот => @ mouseover = "selected = idx; closeSibling (idx)" *

Однако родительский приемный вызов....

I am emitting 3
closing my child undefined
I am emitting 2
closing my child undefined
I am emitting 1
closing my child undefined
I am emitting 0
closing my child undefined

родитель не получает значение idx

1 Ответ

0 голосов
/ 12 ноября 2018

ОК, я понял это.Мне нужно было определить свойство данных idx.

Вот ключевые моменты:

  data() {
    return {
      idx: undefined
   },
   methods: {
     closeSibling: function(idx) {
        console.log("I am emitting" + idx)
        this.$emit('closeMySibling', this.idx = idx)
    },
    closeMyChild: function() {
        console.log('closing my child' + this.idx)
     }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...