小程序中会使用大量的图片，点击按钮切换图片，小程序进入默认的界面加载图片会有一个过程，图片显示不完全影响用户体验。除了图片预加载的方式（先加载模糊的后替换），是否有其他的优化方式。例如在前一个页面能否就加载下一个页面需要使用的图片，进入下一个页面图片已经加载完成，而不是才开始加载。

movable-view  设置x y 属性会有一个动画，现在不希望有这个setData之后直接出现在对应位置，该如何设置

Bug * Bug 表现是什么？预期表现是什么？ this.setData更新movable-view数据，movable-view组件位置重置(并没有修改x,y值)；预期表示是this.setData更新movable-view数据，组件的位置不会改变 * 如何复现？ .wxml <movable-area style="height: 1000rpx; width: 100%; background: red;" scale-area> <block wx:for="{{imgsk}}" wx:key> <movable-view style="width:{{item.width}};height:{{item.height}};background:{{item.bgcolor}};"x="{{item.x}}" y="{{item.y}}" direction="all"  damping="99999999999" data-ind="{{item.ind}}"> movable-view> block> movable-area> <view style="width:120rpx;height:60rpx;background:yellow" catchtap="more"> <text>点我text> view> .js Page({ data:{ imgsk: [ { img_src: '/images/yizi.png', x: 200, y: 120, width: '80rpx', height: '80rpx', bgcolor: 'blue' }, { img_src: '/images/yizi.png', x: 100, y: 400, width: '80rpx', height: '80rpx', bgcolor: 'green' } ] }, more:function(){ // var inde = this.data.imgsk.length // this.data.imgsk.push({ //   img_src: '/images/yizi.png', //   x: 10, //   y: 10, //   width: '80rpx', //   height: '80rpx', //   bgcolor: 'black' // }); var imgskc = this.data.imgsk; this.setData({ imgsk: imgskc }); } }) * 解决方式 修改.wxml为以下代码 <movable-area style="height: 1000rpx; width: 100%; background: red;" scale-area> <block wx:for="{{imgsk}}" wx:key> <movable-view style="width:{{item.width}};height:{{item.height}};background:{{item.bgcolor}};transform: translateX({{item.x+'px'}}) translateY({{item.y+'px'}}) translateZ(0px) scale(1); transform-origin: center center 0px;"x="{{item.x}}" y="{{item.y}}" direction="all"  damping="99999999999" data-ind="{{item.ind}}"> movable-view> block> movable-area> <view style="width:120rpx;height:60rpx;background:yellow" catchtap="more"> <text>点我text> view> 说明： 位置信息最终是通过transform: translateX({{item.x+'px'}}) translateY({{item.y+'px'}}) translateZ(0px) scale(1); transform-origin: center center 0px;来确定的，因此添加这些属性且设置对应值就能解决之前的问题

Bug 有多个movable-view ，bindscal始终触发示例中蓝色的movable-view放大缩小。且回调始终执行onScale1 ，打印1。 * 如何复现？  代码如下 <movable-area style="height: 1206rpx; width: 100%; background: red;" scale-area> <movable-view style="height: 50px; width: 50px; background: blue;" direction="all" bindchange="onChange" x="100" y="200" bindtap="onTap" bindscale="onScale1" scale scale-min="0.5" scale-max="4" scale-value="1"> </movable-view> <movable-view style="height: 100px; width: 100px; background:green;" direction="all" bindchange="onChange" x="10" y="20" bindtap="onTap" bindscale="onScale2" scale scale-min="0.5" scale-max="4" scale-value="1"> </movable-view> </movable-area> .js Page({ onChange: function (e) { }, onScale1: function (e) { console.log('1') }, onScale2: function (e) { console.log('2') } }) ************解决方式 通过 scale="{{switch}}" 控制scale的状态，两个movable-view可以切换数据中switch的值控制哪一个组件触发。代码如下 .wxml <movable-area style="height: 1206rpx; width: 100%; background: red;" scale-area> <movable-view style="height: 50px; width: 50px; background: blue;" direction="all" bindchange="onChange" x="100" y="200" bindtap="onTap" bindscale="onScale1" scale="{{switc}}" scale-min="0.5" scale-max="4" scale-value="1"> </movable-view> <movable-view style="height: 100px; width: 100px; background:green;" direction="all" bindchange="onChange" x="10" y="20" bindtap="onTap" bindscale="onScale2" scale="{{!switc}}" scale-min="0.5" scale-max="4" scale-value="1"> </movable-view> </movable-area> .js Page({ data:{ switc:true}, onTap:function(){ var flag = this.data.switc this.setData({ switc: !flag }) } })