Skip to content

drawer

功能

el-drawer 的修改版

懒渲染模式(未开启时不渲染,打开时渲染,关闭时销毁),常用于循环数据的默认隐藏

功能示例

展示区
参数:默认 footer
参数:全屏
参数:默认全屏
参数:内边距
滚动内容,注意上下边距的不同

最小示例

vue
<template>
    <Wrapper>
        <VcDrawer v-model="visible" title="测试">
            内容
        </VcDrawer>
        <VcButton @click="() => toggleVisible()">打开</VcButton>
    </Wrapper>
</template>

<script lang="ts" setup>
import VcButton from '@/components/button/button.vue'
import VcDrawer from '../drawer.vue'

const [visible, toggleVisible] = useToggle()
</script>

API