2***@qq.com
2***@qq.com
  • 发布:2019-11-02 20:18
  • 更新:2019-11-28 20:01
  • 阅读:1276

【报Bug】nvue 下,bindingX 在安卓端不起作用

分类:nvue

详细问题描述

下面的代码,会在 iOS 上正确发生滑动效果的动画,同样的代码,在安卓真机测试时,没有任何动画产生。

<image :src="seminarParam.poster" class="card-bg-cover-image" mode="top-center"
ref="refImage" style="transform: scale(1.2)"

</image>

...

<view class="bg-cover-mask" ref="refMask"></view>

...

<scroll-view class="nv-scroll-v-2" scroll-y="true" show-scrollbar="false" scroll-with-animation="true" enable-flex="true" offset-accuracy="1" @scroll="onListScroll"
ref="refScroll"
>
...
</scroll-view>

mounted() {
...
this.bindAnimations();
}

methods: {
...
getEl(el) {
if (typeof el === 'string' || typeof el === 'number') return el;
// #ifdef APP-PLUS-NVUE
return el.ref;
// #endif
// #ifndef APP-PLUS-NVUE
return el instanceof HTMLElement ? el : el.$el;
// #endif
},
bindAnimations() {
// #ifdef APP-PLUS-NVUE
const Binding = uni.requireNativePlugin('bindingx');
let self = this;
let refScroll = this.getEl(self.$refs.refScroll);
let refImage = this.getEl(self.$refs.refImage);
let refMask = this.getEl(self.$refs.refMask);
Binding.bind({
eventType: 'scroll',
anchor: refScroll,
props: [
{
element: refImage,
property: 'transform.scale',
expression: 'y >= 0 ? max(1.2-y/500,1.0) : (1.2 - y/200)',
},
{
element: refImage,
property: 'transform.translateY',
expression: 'y>=0 ? -y : 0',
},
{
element: refImage,
property: 'opacity',
expression: 'y<=0?1.0:max(0.0, (1-y/500))'
},
{
element: refMask,
property: 'opacity',
expression: 'y<=100?0.0:max(0,min(1.0, (y-100)/120))',
},
],
});
// #endif
},

}

重现步骤

上面代码编译运行,iOS 正确,android 不正确

IDE运行环境说明

[HBuilder 或 HBuilderX。如果你用其他工具开发uni-app,也需要在此说明]
18:40:06.210 项目 'FunCamp' 开始编译...
18:40:07.295 编译器版本:2.3.7
18:40:07.300 当前项目编译模式:自定义组件模式。编译模式差异见:https://ask.dcloud.net.cn/article/35843
18:40:07.317 当前nvue编译模式:uni-app 。编译模式差异见:https://ask.dcloud.net.cn/article/36074
18:40:28.131 DONE Build complete. Watching for changes...
18:40:28.131 项目 'FunCamp' 编译成功.

[IDE版本号]

[windows版本号]

[mac版本号]
MacOS 10.14.6

uni-app运行环境说明

[运行端是h5或app或某个小程序?]

[运行端版本号]

[项目是cli创建的还是HBuilderX创建的?如果是cli创建的,请更新到最新版cli再试]
HBuilderX

[编译模式是老模板模式还是新的自定义组件模式?]
自定义组件

App运行环境说明

[Android版本号]
华为 Mate20Pro,真机,结果不正确

[iOS版本号]
iPhone 11 Pro,iOS13,模拟器,结果正确
iPhone 6,iOS12,真机,结果正确

[手机型号]

[模拟器型号]

附件

[IDE问题请提供HBuilderX运行日志。菜单帮助-查看运行日志,点右键打开文件所在目录,将log文件压缩成zip包上传]

[App问题请提供可重现问题的代码片段,你补充的细一点,问题就解决的快一点]

[App安装包或H5地址]

[可重现代码片段]

联系方式

[QQ]
271393

2019-11-02 20:18 负责人:无 分享
已邀请:
木公

木公

请问楼主解决了吗

DCloud_uniCloud_WYQ

DCloud_uniCloud_WYQ

传个压缩包上来,直接能跑起来的那种

木公

木公

@DCloud_UNI_王亚琪

上传 包中已经复现出来这个问题 模式为 weex 自定义组件模式。

目前已经发现这个原因是: andriod手机 在绑定了 bindingx之 后,
如果被绑定的元素里面内容发生变化,那 bindingx就失效了。 但是IOS不会有这个问题。

所以想问问这块 Uni-app在底层对 bindingx实现, Andriod与IOS是不是有什么不同

木公

木公

不知道楼主是否也存在这样的情况

  • DCloud_uniCloud_WYQ

    你的示例不是开启setTimeout就正常了吗?测试了一下安卓上内容变化没有问题

    2019-11-28 22:10

  • 木公

    回复 DCloud_uniCloud_WYQ: 开启 setTimeout 是正常了 , 但是IOS 不开启 setTimeout 也是正常的, 唯一的变化 是 listdata 最开始 是[] ,然后我绑定了 bindingx ,然后我更新了listdata数据 , 这个时候,andriod 就不生效了, 但是IOS是可以的, 这说明 在andriod上,绑定的bindingx因为listdata数据更新之后消失了。 我想提的是这个问题。。

    2019-11-29 11:54

  • DCloud_uniCloud_WYQ

    回复 木公: 可以尝试一下看weex本身是不是就这样的

    2019-11-29 15:01

该问题目前已经被锁定, 无法添加新回复