Vuejs 调用 $refs

Question

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

ref=cart 在 <drawer> 里面，我可以从那个按钮调用吗？怎么样？

---已编辑---

---edited solve with 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()
  }
}

Answer 1

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

最好的解决方案是使用 Vuex，但当然，如果您只是为此需要它，则不要。

Vue 引用很棘手，并不总是可以使用。解释很长，和Vue如何渲染有关。

Vuejs 调用 $refs

Vuejs call $refs

vue.js

vuejs2