小程序中bottom: 0的评论框“消失”是因为fixed元素无法覆盖map、video等原生组件，需用cover-view实现；h5和app端可用position: fixed配合软键盘适配。

直接用 position: fixed + bottom: 0 在 H5 上能跑通，但在小程序里会被原生组件（比如 map、video）盖住，甚至被下拉刷新容器截断——这不是样式写错了，是平台限制。

为什么 bottom: 0 的评论框在小程序里“消失”了

小程序中，view 类标签无法真正悬浮在所有原生组件之上。当你页面里有 map、video 或开启下拉刷新时，fixed 元素会被裁剪或完全不可见。这不是 z-index 能解决的，而是 WebView 渲染层和原生层的层级隔离导致的。

• 真机调试时能看到评论框在 map 下面“透出”，但点击无效、位置错乱
• 下拉刷新触发后，fixed 区域坐标重置，可能卡在屏幕中间
• 安卓端部分机型还会因软键盘弹起导致 bottom 偏移失效

小程序必须用 cover-view 实现底部悬浮评论框

cover-view 是唯一能覆盖原生组件的方案，但它有硬性约束：必须作为 map、video、camera 等原生组件的直接子节点才能生效。uni-app 没有全局挂载点，所以得“借壳”：

Hybrid Auth：通过微博/社交网站和ID来提供验证功能实现同步登录网站功能

下载

• 在 App.vue 最外层加一个隐藏 <video src="" style="display:none"></video>
• 用 uni.createCoverView() 创建实例，并 append 到该 video 元素下
• 通过 coverView.setStyle({ bottom: '0', width: '100%', height: '120rpx' }) 控制位置和尺寸
• 事件监听只能用 bind:touchstart / bind:tap，不能写 @click 或 v-if

H5 和 App 端用 fixed + 动态适配软键盘

H5 端可直接用 position: fixed，但 App 端（尤其是 iOS）软键盘弹出会把 bottom: 0 推到键盘上方，导致遮挡输入框。需要监听软键盘事件：

• 调用 uni.onKeyboardHeightChange 获取键盘高度
• 当键盘弹出时，把评论框 bottom 设为键盘高度值（如 bottom: '280rpx'）
• 键盘收起时还原为 bottom: '0'
• 注意：Android 部分厂商（华为、小米）需额外判断 plus.navigator.hasSoftKeyBoard()

跨页面保持状态并避免重复渲染

评论框不是每个页面都 new 一个，而是全局单例。它的显隐、输入内容、是否聚焦，都得统一管理：

• 状态存到 PINIA 或 uni.$u.store（若用 uView），不要放页面 data 里
• 在 App.vue 中 watch store.showCommentBar，控制 cover-view 的 hidden 属性（小程序）或 v-show（H5/App）
• 输入框 focus 状态要主动同步：iOS 键盘弹出后，input 可能失焦，需手动 el.focus()
• 切页时记得 uni.$off('comment:submit')，否则旧页面监听器残留

cover-view 的样式能力极弱，圆角、阴影、渐变都得靠父容器模拟；而软键盘适配在不同平台行为不一致，最稳的方式是：H5 用 CSS，App 用 plus API，小程序死守 cover-view 规则——别试图一套代码三端通吃。