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

相关推荐
花菜会噎住1 小时前
Vue3核心语法进阶(computed与监听)
前端·javascript·vue.js
I'mxx1 小时前
【vue(2)插槽】
javascript·vue.js
花菜会噎住1 小时前
Vue3核心语法基础
前端·javascript·vue.js·前端框架
全宝1 小时前
echarts5实现地图过渡动画
前端·javascript·echarts
吃饭睡觉打豆豆嘛3 小时前
彻底搞懂前端路由:从 Hash 到 History 的演进与实践
前端·javascript
lbh4 小时前
简单文本编辑器:基于原生JavaScript的智能文本选择工具栏
前端·javascript
典学长编程4 小时前
前端开发(HTML,CSS,VUE,JS)从入门到精通!第三天(JavaScript)
前端·javascript·css·html·前端开发
Jimmy6 小时前
TypeScript 泛型:2025 年终极指南
前端·javascript·typescript
Spider_Man6 小时前
栈中藏玄机:从温度到雨水,单调栈的逆袭之路
javascript·算法·leetcode
jstart千语7 小时前
【vue】创建响应式数据ref和reactive的区别
前端·javascript·vue.js