v-on: проблема щелчка, если у элементов есть другой элемент внутри - PullRequest
Новая
       8

v-on: проблема щелчка, если у элементов есть другой элемент внутри

0 голосов
/ 05 декабря 2018

Я имею дело с проблемой моего события click в vue js.Я нажал даже на элемент, в котором есть другой элемент.

Вот мой код: 

<span class="pull-down-controller" @click="pullDown($event)">
     <span class="indicator">－</span> Controller
</span>

во внешнем интерфейсе будет отображаться － Controller, если я нажму слово Controller, то появитсявызовите указанную функцию, которая является pullDown(), но почему, когда я нажимаю на индикатор или символ минус, она ничего не делает, даже если она находится внутри <span>, где я помещаю событие @click?

Причина, по которой я поместил <span> внутри него, чтобы я мог изменить символ на ＋, используя jquery.

спасибо!

1 Ответ

0 голосов
/ 05 декабря 2018

Нет необходимости в jQuery, реактивность Vue обеспечивает все, что вам нужно: 

new Vue({
  el: '#app',
  template: `
  <span @click="pullDown" style="font-size: 48px;">
     <span>{{ indicator }}</span> Controller
</span>
`,
  data () {
    return {
      expanded: false
    }
  },
  computed: {
    indicator () {
      return this.expanded ? '+' : '-'
    }
  },
  methods: {
    pullDown (event) {
      this.expanded = !this.expanded
    }
  }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app"></div>
...