小编Pen*_*nar的帖子

iOS 15 Safari 在键盘可见时检测浮动地址栏

在 Safari iOS15 中,默认情况下,地址栏固定在视口的底部。正如iOS 15 Safari 浮动地址栏所解释的,您可以使用padding-bottom: env(safe-area-inset-bottom)它来确保内容显示在其上方。

但是,如果键盘可见,则环境变量不起作用,因为浮动地址栏显示在键盘上方,并且它会清除视口的底部。这可能会导致某些内容隐藏在其下方。

这是该问题的简单演示:https ://pmusaraj.github.io/ios15-bottom-bar2.html

在 iOS 14 及更低版本或在 Safari 设置为在顶部显示地址栏的 iOS15 上,当文本区域处于焦点状态时,您可以看到提交按钮。在默认的iOS15上,你不能,因为设备返回的视口高度不包括浮动地址栏。

更新:WebKit 错误报告https://bugs.webkit.org/show_bug.cgi?id=229876

mobile-safari ios ios15

28
推荐指数
1
解决办法
8429
查看次数

使用Material Design Lite和React

我试图在使用React的现有项目上使用MDL,我遇到了几个问题.第一次加载时看起来很好,尽管有很多警告信息:

警告:ReactMount:Root元素已从其原始容器中删除.新容器:

这几乎发生在具有MDL识别的类的每个DOM元素上(例如:mdl-layout,mdl-layout__content等),它发生在任何DOM更改上.

此外,在更改路由时,存在"Invariation Violation"错误:

未捕获错误:不变违规:findComponentRoot(...,.0.2.0.1.1.0.0.0.0):无法找到元素.这可能意味着DOM意外地发生了变异(例如,浏览器)......

这是否意味着MDL和React几乎不兼容?

更新:如果具有class ="mdl-js-layout"的元素不是reactjs渲染函数中最顶层的元素,则问题将消失.一旦我包裹了那个元素,一切都很好.

reactjs material-design-lite

17
推荐指数
2
解决办法
5768
查看次数