vue 父子组件通信
父组件:
<template>
<div id="app">
<img width="60px" id="logo" src="./assets/LOGO.svg"/>
<NavMain @introduce='themetext' :index="my"></NavMain>
</div>
</template>
<script>
import NavMain from './components/NavMain'
export default {
name: 'App',
components:{
NavMain,
},
methods:{
themetext (opt) {
console.log('111')
this.theme = opt.Text;
}
}
}
</script>
子组件:
<template>
<div class="my_nav">
{{index}}
<el-menu
:default-active="activeIndex"
class="el-menu-demo"
mode="horizontal"
@select="handleSelect2">
<el-menu-item index="处理中心" >处理中心</el-menu-item>
</el-menu>
<div class="line"></div>
</div>
</template>
<script>
export default {
name:'NavMain',
props:['index'],
methods: {
handleSelect2(id,index) {
this.$emit('introduce',{
Text:id
})
}
}
}
</script>

浙公网安备 33010602011771号