vue父子组件传值

父组件向子组件传值
1.在父组件中调用子组件时，定义要传递的参数

    //使用子组件，并传递value作为prop
    <childComponent :childValue="parentValue"></childComponent>
   // 父组件的data中定义传递的参数
     data() {
    return {
      parentValue: "这是父组件的值" // 父组件的值
    };
  }

2.在子组件中，可以通过props属性接收父组件传递的值

export default {
  name: "Info",
  dicts: ['order_status','product_type'],
  props: {
    childValue: {
      type: String,
      default: "",
    },    
  },

子组件向父组件传值
如果子组件需要向父组件传递一个名为 ‘childFun’ 的事件，并传递一个数据 item
注：childFun为子组件中要传递参数的事件名，parentFun 为父组件中接收收子组件中数据的方法

1.在父组件中调用子组件时，定义接收参数的方法 parentFun

 <childComponent ref="cusShortNamRef"  @childFun="parentFun"></childComponent>
 //父组件接收数据的方法
 parentFun(val) {
      this.form.customerLedgerId = val
      this.customerShortNameVisible = false
    }

2.在子组件需要传递数据的方法中使用this.$emit调用名为 childFun 的事件，并传递参数 item

//table单选
    handleCurrentChange(val) {
      this.currentRow = val;
      this.$emit("childFun ",this.currentRow.item)
    },

父组件改变子组件中属性的方法
1.在父组件中调用子组件时，定义组件的ref属性

 <childComponent ref="childComRef"  :childValue="parentValue"></childComponent>

2.通过this.$refs.childComRef.属性名 来获取子组件的dom，如

  this.$nextTick(function(){
        this.$refs.childComRef.selectShow = false
      })