
<template>
<el-button text @click="dialogVisible = true">
click to open the Dialog
</el-button>
<el-dialog
v-model="dialogVisible"
title="Tips"
width="30%"
:before-close="handleClose"
>
<span>This is a message</span>
<template #footer>
<span class="dialog-footer">
<el-button @click="dialogVisible = false">Cancel</el-button>
<el-button type="primary" @click="dialogVisible = false">
Confirm
</el-button>
</span>
</template>
</el-dialog>
</template>
组件对外暴露一个方法 open,基于open传来的参数,区分添加还是编辑
open({}) => 表单无需渲染,说明是添加
open({ id, cate_name,... }) => 表单需要渲染,说明是编辑
open调用后,可以打开弹窗


Vue2 => v-model :value 和 @input 的简写
Vue3 => v-model :modelValue 和 @update:modelValue 的简写
<channel-select v-model:modelValue="params.cate_id"></channel-select>

组件对外暴露一个方法 open,基于open传来的参数,区分添加还是编辑
open({}) => 表单无需渲染,说明是添加
open({ id,...,.. }) => 表单需要渲染,说明是编辑
open调用后,可以打开抽屉




