组件间通过refs进行传值
模拟:test组件向test2组件传值,父组件test里面通过ref对test2组件进行标识挂载,方法区通过this.$refs.ref标识.子组件方法即可进行传值
test组件:
<template>
<div>
我是父组件
<el-button @click="giveChildValue()">点击给子组件传个值</el-button>
<test2 ref="test2Flag"></test2>
</div>
</template>
<script>
import test2 from '@/views/test2/index.vue'
export default {
name:'father',
components:{
test2
},
data(){
return{
fatherToChild:'儿子我是你爸爸',//将这个变量传值给子组件
}
},
methods:{
giveChildValue(){
this.$refs.test2Flag.childMethod(this.fatherToChild)
}
}
}
</script>
<style>
</style>
test2组件:接收test传过来的值
<template>
<div>
我是子组件
</div>
</template>
<script>
export default {
name:'child',
data(){
return{
childParams:"",
}
},
methods:{
//val为父组件传过来的值
childMethod(val){
this.childParams = val
console.log(val,'我是父组件传过来的值你来打我啊')
}
}
}
</script>
<style>
</style>