<script setup lang="ts">
import { ref } from 'vue'
const styObj = {
width: '600rpx',
height: '500rpx',
'background-color': 'pink'
}
</script>
<template>
<view class="move-container">
<movable-area class='area' scale-area>
<!-- :style="{ width: boxW + 'px', height: boxH + 'px', 'background-color': 'pink'}" -->
<movable-view
:style="styObj"
direction='all'
:animation="false"
:scale-min="0.1"
:scale-max="10"
scale
>
</movable-view>
</movable-area>
</view>
<view class="move-container">
<movable-area class='area' scale-area>
<movable-view
class="move-box"
direction='all'
:animation="false"
:scale-min="0.1"
:scale-max="10"
scale
>
</movable-view>
</movable-area>
</view>
</template>
<style lang="scss">
page {
display: flex;
flex-direction: column;
justify-content: space-between;
position: relative;
height: 100%;
}
.move-container {
margin-top: 50rpx;
width: 100%;
height: 600rpx;
display: flex;
justify-content: space-between;
position: relative;
overflow: hidden;
}
.area {
width: 50%;
height: 100%;
background-color: aquamarine;
.move-box {
width: 600rpx;
height: 500rpx;
background-color: orange;
}
}
</style>

- 发布:2025-02-11 09:51
- 更新:2025-02-11 16:35
- 阅读:175
【报Bug】快手小程序,movable-view 样式绑定修改 size,其移动范围不更新
产品分类: uniapp/小程序/快手
PC开发环境操作系统: Mac
PC开发环境操作系统版本号: 14.2.1
第三方开发者工具版本号: 当前版本: 1.64.0-2ac5ae3-arm64
基础库版本号: 1.80.0
项目创建方式: CLI
CLI版本号: 3.0.0
示例代码:
操作步骤:
运行上面代码,缩小 pink movable-view 并移动
运行上面代码,缩小 pink movable-view 并移动
预期结果:
运行上面代码,缩小pink盒子并移动,可以在 movable-area 内移动到任意位置
运行上面代码,缩小pink盒子并移动,可以在 movable-area 内移动到任意位置
实际结果:
运行上面代码,缩小pink盒子并移动,无法在 movable-area 中随意移动
运行上面代码,缩小pink盒子并移动,无法在 movable-area 中随意移动
bug描述:
uni-app开发 快手小程序,如下代码所示,,pink movable-view 的初始 size 为 0x0,那么其刚好可以在 movable-area 内移动。css绑定修改 size 后,移动范围没有更新,和 size 为 0x0 时一样。
1 个回复
zmao (作者)
麻烦看下哈,demo已上传,感谢了