1.上级传给下级
父级组件:
<ReqTab ref="crontabRef" @hide="openCron=false" @fill="crontabFill" :expression="expression" :method="method" ></ReqTab>
函数中赋值:

子组件:
const props = defineProps({
hideComponent: {
type: Array,
default: () => [],
},
expression: {
type: String,
default: ""
},
method: {
type: String,
default: ""
}
})
引用:props.expression
2.子组件更新数据到父组件
父组件: <ReqTab ref="crontabRef" @hide="openCron=false" @fill="crontabFill" :expression="expression" :method="method" ></ReqTab> 注意:@fill="crontabFill"
/** 确定后回传值 */
function crontabFill(value) {
formCase.value.request = value;
}
子组件:

const emit = defineEmits(['hide', 'fill'])
// 由子组件触发,更改表达式组成的字段值
function updateCrontabValue(value) {
emit("fill", value)
}
3.监听器,作用:监控数据变化,无需按钮
<el-input type="textarea" v-model="nums" :autosize="{ minRows: 4, maxRows: 4}"/>
const emit = defineEmits(['update'])
watch(nums,(newValue,oldValue) => {
console.log('newValue:',newValue);
emit('update', newValue);
});
4.子组件数据传输:监听器监控数据变化后,把值传给update,update传给fill,fill更新最终的父组件数据:formCase.value.request



















