NextUI 总算推出了一个修复 Modal 在 iOS 上必须固定定位的版本,但是我更新之后,它依旧存在点细节问题,由于其父元素使用 Flex 布局,但采用了 align-items: center
来定位居中,因此有一个 Bug,弹出键盘之后上半部分无法显示,参考我往常的经验应该使用 margin-top: auto; margin-bottom: auto
。还有一个滚动容器导致下半部分“截肢”的问题但是它写的不好咱也没有什么办法呢。
以下是我的样式覆盖方案,可以解决它默认的一些奇怪规则。item-start
让 Flex 默认对齐,h-auto
覆盖其 JS 控制的奇怪高度,my-auto
居中并修复“截肢”问题。
<Modal
placement="center"
shouldBlockScroll={false}
classNames={{ wrapper: "items-start h-auto", base: "my-auto" }}
>
...
</Modal>