在vue2中,父组件在子组件标签中添加一个事件,若子组件没有$emit抛出该事件又想触发父组件的事件,这时候就需要事件修饰符了
Module.vue
<template>
<button>按钮</button>
</template>
<script>
export default {
}
</script>
App.vue
<template>
<div id="app">
<Native @click="fn"/>
</div>
</template>
<script>
import Native from './components/Native.vue';
export default {
name: 'App',
components: {
Native
},
methods:{
fn(){
console.log('事件触发')
}
}
}
</script>
这个时候点击按钮是无法触发事件的
当我们在@click后面加上.native时
App.vue
<template>
<div id="app">
<Module @click.native="fn"/>
</div>
</template>
<script>
import Module from './components/Module.vue';
export default {
name: 'App',
components: {
Module
},
methods:{
fn(){
console.log('事件触发')
}
}
}
</script>
这时,点击子组件中的按钮就可以触发父组件里的事件了