温馨提示:本文翻译自stackoverflow.com,查看原文请点击:vue.js - How add click events to Vue slots?

vue.js - 如何将点击事件添加到Vue广告位?

发布于 2020-03-29 21:39:57

父元素:

<solt-div>
  <button slot="trigger">选取文件</button>
</solt-div>

插槽组件:

export default {
  render () {
      return(<div>{this.$slots.trigger}</div>)
  }
}

我需要添加一个click事件this.$slots.trigger以触​​发solt-div组件中的功能

但是此事件不能添加到外部DIV,因为还有其他插槽

<trigger @click="fn"></trigger>

查看更多

提问者
ebyte ebyte
被浏览
18
Troy Kessler 2020-01-31 18:25

在尝试用Render函数添加事件后,createElement我来到了解决方案,您可以在其中使用引用来调用函数。solt-div

父母

<solt-div ref="soltDiv">
    <button slot="trigger" @click="$refs.soltDiv.fn()">test</button>
</solt-div>

solt-div

export default {
  render () {
      return(<div>{this.$slots.trigger}</div>)
  },
  methods: {
    fn() {
      // do stuff
    }
  }
},

发布
问题

分享
好友

手机
浏览

扫码手机浏览