Vuejs打电话给$ refs

时间:2017-01-04 03:26:51

标签: vuejs2 vue.js

<div>
    <button @click="$refs.cart.open()">open</button>
    <drawer></drawer>
</div>

ref = cart在<drawer>内,我可以通过该按钮拨打电话吗?如何?

--- ---编辑

enter image description here

  

---用vuex编辑解决---

根模板

toggle() {
    this.$store.dispatch('toggle', {
      toggle: 'close'
    }).then(() => {
      this.$store.dispatch('toggle', {
        toggle: 'open'
      })
    })
  }

抽屉内

computed: {
  toggle() {
    return this.$store.state.toggle
  }
},
watch: {
  toggle(val) {
    if (val == 'open') this.$refs.cart.open()
  }
}

1 个答案:

答案 0 :(得分:2)

一个简单的解决方案(不是最好的)就是在这里使用Vue事件总线在组件之间进行通信。 Quasar有一个全球事件总线(http://quasar-framework.org/api/js-events.html)。

最好的解决方案是使用Vuex,但当然,如果你只需要它,那就不是了。

Vue引用很棘手,并不总是可以使用。解释很长,与Vue渲染方式有关。