Vue组件之间的参数传递与方法调用的实例详解

props: {
  param: {
    type: Object
  }
},
data() {
    return {
        ...
    }
},

<child ref="abc"></child>

this.$refs.abc.XXX()

// 无参
this.$emit('abc')
​
// 带参
this.$emit('abc', {params})

// 方法
    this.$parent.abc()  
    
    // 属性
    this.$parent.abcd = 1

created() {
    EventBus.$off('Name')
    EventBus.$on('Name', (data1, data2) => {
        this.method(data1,data2)
    })
}

EventBus.$emit('Name', res.data.list, flag)

// 默认写法
  props: {
    btnClick: {
      type: Function,
      default: function() {}
    },
    titleName: {
      type: String,
      default: "内容"
    },
    display: {
      type: String,
      default: "table" 
    },
    columnNum: {
      type: Number,
      default: 1
    },
    columnslist: {
      type: Array,
      default() {
        return [];
      }
    },
    showPage: {
      type: Boolean,
      default: true
    },
    apiData: {
      type: Object,
      default() {
        return {};
      }
    },
    param: {
      type: Object,
      default() {
        return {};
      }
    },
    defaultParam: {
      type: Boolean,
      default() {
        return true;
      }
    }
  },

// 正确：
 datalist:{
     type:Array,
     default:function(){
         return []
     }
 }
​
// 错误
 datalist:{
     type:Array,
     default:[]
 }
 
// 或者直接跟上面第一个代码一样，不管什么类型，都写在函数返回中。