vue同级组件的互相调用
子组件t2<template><div><p>t2</p></div></template><script>export default {name:'OnceT2',methods:{sayHello2(){...
·
子组件t2
<template>
<div>
<p>t2</p>
</div>
</template>
<script>
export default {
name:'OnceT2',
methods:{
sayHello2(){
console.log('sayHello2');
}
}
}
</script>
子组件t1
<template>
<div>
<p>t1</p>
</div>
</template>
<script>
export default {
name:'OnceT1',
inject:['sayHello2'],//依赖注入的内容,导入父组件的某个方法
methods:{
sayHello1(){
console.log('sayHello1');
}
},
mounted(){
this.sayHello2();
}
}
</script>
父组件
<template>
<button @click="hehe">hehe</button>
</template>
import {OnceT1,OnceT2} from '_c/test/index.js'//导入同级组件
<script>
export default {
provide(){//依赖注入
return{
sayHello2:this.hehe
}
},
methods:{
hehe(){
this.$refs.t2.sayHello2();
}
}
}
</script>
更多推荐
已为社区贡献4条内容
所有评论(0)