mirror of
https://github.com/element-plus/element-plus.git
synced 2025-12-19 09:09:40 +08:00
* Revert "drawer resizable #21608" * refactor: drawer resizable * feat: direction & event core * docs: update * fix: animation conflict * fix: watchEffect onCleanup hrm error * test: add resize case * chore: format * test: old case typo * refactor: rel #21595 & add hover style Co-authored-by: thinkasany <480968828@qq.com> Co-authored-by: cszhjh <cszhjh@gmail.com> * chore: del useless file * chore: del useless file * chore: rename Co-authored-by: Dsaquel <291874700n@gmail.com> * fix: use min resizable error * fix: multiple resizable style conflicts * test: fix --------- Co-authored-by: thinkasany <480968828@qq.com> Co-authored-by: cszhjh <cszhjh@gmail.com> Co-authored-by: Dsaquel <291874700n@gmail.com>
22 lines
628 B
Vue
22 lines
628 B
Vue
<template>
|
|
<el-radio-group v-model="direction" @change="drawer = true">
|
|
<el-radio-button value="ttb">top</el-radio-button>
|
|
<el-radio-button value="rtl">right</el-radio-button>
|
|
<el-radio-button value="btt">bottom</el-radio-button>
|
|
<el-radio-button value="ltr">left</el-radio-button>
|
|
</el-radio-group>
|
|
|
|
<el-drawer v-model="drawer" :direction="direction" resizable>
|
|
This is drawer content.
|
|
</el-drawer>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { ref } from 'vue'
|
|
|
|
import type { DrawerProps } from 'element-plus'
|
|
|
|
const direction = ref<DrawerProps['direction']>()
|
|
const drawer = ref(false)
|
|
</script>
|