1.  
  2. 主页
  3.  / 
  4. Vue教程
  5.  / 
  6. Vue教程之子组件绑定原生事件

Vue教程之子组件绑定原生事件

在Vue中,当我们绑定事件到子组件的时候,我们会发现竟然触发不了,这个因为子组件把我们绑定的事件,当成了需要子组件来进行触发的一个事件,因为你父组件去点击的时候,是无法无法触发,得使用前面咱们介绍的子组件使用 $emit 来触发父组件在子组件上定义的这个事件,当然对于普通的 DOM 标签元素来说,是不会有这种情况的。

当然在我们的开发过程中,肯定会遇到在子组件绑定原生事件的情况,因此我们是需要使用 native 来触发子组件上的原生事件。例如:

父组件

<template>
  <div>
    <Demo7 @click.native="handleClick"></Demo7>
  </div>
</template>

<script>
import Demo7 from './components/Demo7'
export default {
  methods: {
    handleClick () {
      console.log('handleClick')
    }
  },
  components: {
    Demo7
  }
}
</script>

子组件

<template>
  <div>
    <h1>test</h1>
  </div>
</template>

这篇文章对您有用吗?

我们要如何帮助您?

发表评论

您的电子邮箱地址不会被公开。