174~197

<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调用后,可以打开抽屉

相关推荐
辰风沐阳29 分钟前
JavaScript 的宏任务和微任务
javascript
冰暮流星1 小时前
javascript之二重循环练习
开发语言·javascript·数据库
Mr Xu_2 小时前
Vue 3 中 watch 的使用详解:监听响应式数据变化的利器
前端·javascript·vue.js
hedley(●'◡'●)3 小时前
基于cesium和vue的大疆司空模仿程序
前端·javascript·vue.js·python·typescript·无人机
百思可瑞教育3 小时前
构建自己的Vue UI组件库:从设计到发布
前端·javascript·vue.js·ui·百思可瑞教育·北京百思教育
CappuccinoRose3 小时前
JavaScript 学习文档(二)
前端·javascript·学习·数据类型·运算符·箭头函数·变量声明
全栈前端老曹3 小时前
【MongoDB】深入研究副本集与高可用性——Replica Set 架构、故障转移、读写分离
前端·javascript·数据库·mongodb·架构·nosql·副本集
NCDS程序员4 小时前
v-model: /v-model/ :(v-bind)三者核心区别
前端·javascript·vue.js
小杨同学呀呀呀呀4 小时前
Ant Design Vue <a-timeline>时间轴组件失效解决方案
前端·javascript·vue.js·typescript·anti-design-vue
qq_532453534 小时前
使用 Three.js 构建沉浸式全景图AR
开发语言·javascript·ar