组件间通过refs进行传值(简单记录)

组件间通过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>