以子组件刷新页面的方法,在父组件中调用子组件刷新页面方法为例
子组件页面-----》EditList:
<template>
<div class="editList">
<el-button type="primary" @click="clickMe">我是子组件</el-button>
</div>
</template>
<script>
export default {
name: 'EditList',
data(){
return {
}
},
methods:{
clickMe(){
this.sonFn()
},
sonFn(){
this.$router.go(0)
}
}
}
</script>
父组件页面-----》list:
<template>
<div class="list">
<h3>父组件页面</h3>
<el-button type="success" @click="toClick">点我调用子组件方法</el-button>
<!-- 3、使用子组件 -->
<EditeList ref="childEvent"/>
</div>
</template>
<script>
// 1、引入子组件
import EditeList from '@/components/EditList'
export default {
name: 'List',
data(){
return {
}
},
methods:{
toClick(){
// 父组件页面调用子组件方法
this.$refs.childEvent.sonFn();
}
},
components:{
// 2、注册子组件
EditeList
}
}
</script>