Skip to content

form/自定义组件

父组件注册

js
//父组件
mounted() {
  //自定义组件插入
  const list = [{
    componentItem: () => import('@/views/web/...'), //
    title: '测试',
    functionName: 'stockTakeBack',
    ref: 'stock'
  }]
  this.componentList = list
}

componentList 参数表

字段说明类型默认值
componentItem组件全路径 ()=>import("")String-
ref组件 ref,用于调用组件String-
functionName自定义组件 $emit 与父级交互方法String-

子组件入参

js
//子组件
props: {
  record: {
    type: Object,
    default: () => ({})
  },
  tableData: {
    type: Object,
    default: () => ({})
  },
  //使用类型(打开方式)  1公共 2查找 3关联
  openMode: {
    type: [String, Number],
    default: 1
  }
}

父子组件交互

js
//父组件
this.baseComponentsInit({
  ref: 'stock', //组件ref
  functionName: 'open', //调用子组件方法,
  data: {} //自定义参数
})

//子组件
open(e) {
  console.log(e);
}

//子组件
this.$emit('change', {
  functionName: 'stockTakeBack', //父组件响应方法 
  data: {} //自定义参数
});

//父组件
stockTakeBack(e) {
  console.log(e);
}