收藏
回答

movable-view 容器中的元素使用 position: fixed 会出现意想不到的效果

框架类型 问题类型 终端类型 微信版本 基础库版本
小程序 Bug 工具 all all

position: fixed 我理解是相对于窗口定位,但是在movable-view 容器中使用时,其效果则变成了相对 movable-view 容器定位。 并且movable-view相关文档并没有介绍这些,我觉得这是个问题

我期望text-box能定位到屏幕的底部而不是movable-view的底部,这使得我不得不因为样式问题将这个与movable-view中其他内容有关联的text-box移动到外部,并且需要额外维护他们的通信关系。 最主要的原因还是他背叛了position: fixed

代码片段

// index.wxml:
<view class="container">
  <movable-area style="height: 600px; width:300px;border: red solid 1px">
    <movable-view direction="all" style="width: 300px;;height: 300px; background-color: pink;">
      content
      <view class="text-box">
        text-box
      </view>
    </movable-view>
  </movable-area>
</view>

// index.wxss
.text-box{
  width: 100px;
  height: 100px;
  position: fixed;
  bottom: 0;
  background-color: beige;
}

// index.js
const app = getApp()
Page({})
回答关注问题邀请回答
收藏
登录 后发表内容