Open shizhihuaxu opened 3 years ago
win chrome vue2.6
https://run.iviewui.com/
将官方 demo 中 Drawer 组件的多层抽屉示例代码同层级的drawer 改为嵌套形式,第二层级嵌套在第一层级的drawer内部(并且两者 transter: true),此时第二层级的抽屉无法显示,被第一层级的抽屉遮盖。
两者均transfer to body 时,被嵌套在内层的抽屉渲染在外层之上
两者均transfer to body 时,被嵌套在内层的抽屉优先于外层抽屉渲染,导致展示时,内层抽屉被外层抽屉遮盖
两个嵌套抽屉的形式如下:
<template> <Button @click="value5 = true" type="primary">Open Drawer</Button> <Drawer title="Multi-level drawer" width="512" :closable="false" v-model="value5"> <Button @click="value6 = true" type="primary">Two-level Drawer</Button> <Drawer title="Two-level Drawer" :closable="false" v-model="value6"> This is two-level drawer. </Drawer> </Drawer> </template>
Environment
win chrome vue2.6
Reproduction link
https://run.iviewui.com/
Steps to reproduce
将官方 demo 中 Drawer 组件的多层抽屉示例代码同层级的drawer 改为嵌套形式,第二层级嵌套在第一层级的drawer内部(并且两者 transter: true),此时第二层级的抽屉无法显示,被第一层级的抽屉遮盖。
What is expected?
两者均transfer to body 时,被嵌套在内层的抽屉渲染在外层之上
What is actually happening?
两者均transfer to body 时,被嵌套在内层的抽屉优先于外层抽屉渲染,导致展示时,内层抽屉被外层抽屉遮盖
两个嵌套抽屉的形式如下: