【问题标题】:Vuejs call $refsVuejs 调用 $refs
【发布时间】:2017-01-04 03:26:51
【问题描述】:
<div>
    <button @click="$refs.cart.open()">open</button>
    <drawer></drawer>
</div>

ref=cart 在&lt;drawer&gt; 内,我可以从那个按钮调用吗?怎么样?

---已编辑---

---用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()
  }
}

【问题讨论】:

  • 多一点代码会有帮助。
  • @saurabh 好的编辑,我使用 QuasarFramework

标签: vuejs2 vue.js


【解决方案1】:

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

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

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

【讨论】:

  • 我仍然不明白在上面的案例中实现事件总线,请你帮我举个例子吗?谢谢。
猜你喜欢
  • 2016-12-26
  • 2021-12-22
  • 2021-07-14
  • 2021-03-21
  • 2017-04-14
  • 2020-11-26
相关资源
最近更新 更多