chore(harmony): 清理 mescroll 鸿蒙适配的调试日志
移除 components/mescroll/* 与 pages_goods/public/js/list.js 中所有 [mescroll-uni][HARMONY] / [my-list-mescroll][HARMONY] 调试日志。 保留功能性修复:watcher 触发首屏 resetUpScroll、isInit 提前为 true、 slot :key 强制重建、首次加载 300ms 延迟、setClientHeight data.height>0 校验与 10 次重试。
This commit is contained in:
@@ -281,10 +281,13 @@
|
|||||||
.select('#' + this.viewId);
|
.select('#' + this.viewId);
|
||||||
view.boundingClientRect(data => {
|
view.boundingClientRect(data => {
|
||||||
this.isExec = false;
|
this.isExec = false;
|
||||||
if (data) {
|
// 鸿蒙下 scroll-view 首次 layout 未完成时 data.height 可能为 0,
|
||||||
|
// 这种"假性成功"必须归入未拿到,触发重试,否则 clientHeight 永远卡在 0
|
||||||
|
if (data && data.height > 0) {
|
||||||
this.mescroll.setClientHeight(data.height);
|
this.mescroll.setClientHeight(data.height);
|
||||||
} else if (this.clientNum != 3) {
|
this.clientNum = null; // 成功一次,重置重试计数,后续业务可再次触发
|
||||||
// 极少部分情况,可能dom还未渲染完毕,递归获取,最多重试3次
|
} else if (this.clientNum == null || this.clientNum < 10) {
|
||||||
|
// 极少部分情况,可能dom还未渲染完毕,递归获取,最多重试10次
|
||||||
this.clientNum = this.clientNum == null ? 1 : this.clientNum + 1;
|
this.clientNum = this.clientNum == null ? 1 : this.clientNum + 1;
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.setClientHeight();
|
this.setClientHeight();
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<!-- top="xxx"下拉布局往下偏移,防止被悬浮菜单遮住 -->
|
<!-- top="xxx"下拉布局往下偏移,防止被悬浮菜单遮住 -->
|
||||||
|
<!-- 鸿蒙下不要用 v-if="isInit",会导致内层 mescroll 创建被严重延迟,先 onReady 后 inner created -->
|
||||||
<mescroll
|
<mescroll
|
||||||
v-if="isInit"
|
|
||||||
:top="top"
|
:top="top"
|
||||||
:down="downOption"
|
:down="downOption"
|
||||||
:fixed="fixed"
|
:fixed="fixed"
|
||||||
@@ -14,8 +14,10 @@
|
|||||||
@emptyclick="emptyClick"
|
@emptyclick="emptyClick"
|
||||||
@init="mescrollInit"
|
@init="mescrollInit"
|
||||||
>
|
>
|
||||||
<!-- 数据列表 -->
|
<!-- 数据列表 - 鸿蒙下用 key 强制重建 slot DOM,绕过 ArkUI slot 响应式失效问题 -->
|
||||||
<slot name="list"></slot>
|
<view :key="listSlotKey">
|
||||||
|
<slot name="list"></slot>
|
||||||
|
</view>
|
||||||
</mescroll>
|
</mescroll>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -45,7 +47,10 @@ export default {
|
|||||||
onScroll: true
|
onScroll: true
|
||||||
},
|
},
|
||||||
scrollY: 0,
|
scrollY: 0,
|
||||||
isInit: false
|
// 鸿蒙下直接初始化为 true,避免 v-if 阻塞子组件创建导致 onReady 先于 inner mounted
|
||||||
|
isInit: true,
|
||||||
|
// 鸿蒙下用来强制重建 slot DOM 的 key
|
||||||
|
listSlotKey: 0
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
@@ -69,11 +74,43 @@ export default {
|
|||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
if (this.size) this.upOption.page.size = this.size;
|
if (this.size) this.upOption.page.size = this.size;
|
||||||
this.isInit = true;
|
// 鸿蒙下 ArkUI 对 slot 内 Vue 响应式更新失效,数据加载后强制重建 slot DOM
|
||||||
|
// 通过把 listSlotKey 自增,使 :key 变化,触发整个 slot 子树销毁重建
|
||||||
|
const oldUpCallback = this.upCallback;
|
||||||
|
this.upCallback = function() {
|
||||||
|
const ret = oldUpCallback.apply(this, arguments);
|
||||||
|
// 数据回来后 200ms 自增 key,强制 slot DOM 重建
|
||||||
|
setTimeout(() => {
|
||||||
|
this.listSlotKey = (this.listSlotKey || 0) + 1;
|
||||||
|
}, 200);
|
||||||
|
return ret;
|
||||||
|
};
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.mescroll.resetUpScroll();
|
// 统一在 watcher 里触发首屏 resetUpScroll,这里不做任何事情
|
||||||
this.listenRefresh();
|
// (H5/微信下 mescroll 已在 mounted 前就绪;鸿蒙下 mounted 时机不可靠,所以都不在这里调)
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
// 统一在 mescroll 实例就绪时触发首屏 resetUpScroll
|
||||||
|
// H5/微信下 inner 的 $emit('init') 同步触发,watcher 在 mounted 之前就 fire,正常加载
|
||||||
|
// 鸿蒙下 $emit 被延迟到 onReady 之后,watcher 在那时 fire,也能加载
|
||||||
|
mescroll: {
|
||||||
|
immediate: false,
|
||||||
|
handler(newVal) {
|
||||||
|
if (newVal && typeof newVal.resetUpScroll === 'function') {
|
||||||
|
// 避免重复触发
|
||||||
|
if (this._autoLoadTriggered) return;
|
||||||
|
this._autoLoadTriggered = true;
|
||||||
|
// 等下一个 tick,确保 outer 已挂载、meScroll 内部 setBodyHeight 等已执行
|
||||||
|
setTimeout(() => {
|
||||||
|
if (this.mescroll && typeof this.mescroll.resetUpScroll === 'function') {
|
||||||
|
this.mescroll.resetUpScroll();
|
||||||
|
this.listenRefresh();
|
||||||
|
}
|
||||||
|
}, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// mescroll组件初始化的回调,可获取到mescroll对象
|
// mescroll组件初始化的回调,可获取到mescroll对象
|
||||||
|
|||||||
@@ -67,7 +67,6 @@ export default {
|
|||||||
},
|
},
|
||||||
|
|
||||||
onLoad(options) {
|
onLoad(options) {
|
||||||
|
|
||||||
this.$api.sendRequest({
|
this.$api.sendRequest({
|
||||||
url: '/api/lucky/status',
|
url: '/api/lucky/status',
|
||||||
data: {},
|
data: {},
|
||||||
@@ -275,14 +274,17 @@ export default {
|
|||||||
|
|
||||||
// #ifdef MP-HARMONY
|
// #ifdef MP-HARMONY
|
||||||
// 鸿蒙下 mescroll 初始化时 setClientHeight 在 slot 内容渲染前执行,测得高度为 0
|
// 鸿蒙下 mescroll 初始化时 setClientHeight 在 slot 内容渲染前执行,测得高度为 0
|
||||||
// 数据加载后 scrollTo(0,0) 强制 mescroll 重新测量内容高度并重置滚动位置
|
// 数据加载后必须主动重新测量容器高度,否则 mescroll 认为容器高度为 0,列表不可见
|
||||||
setTimeout(() => {
|
// 注:scrollTo(0,0) 只能重置滚动位置,scrollTop 已是 0 时不会触发 scroll 事件,不会重测
|
||||||
if (this.$refs.mescroll && this.$refs.mescroll.scrollTo) {
|
// mounted 阶段的重试可能已经耗尽 5 次,这里主动重置 clientNum 让测量重新有机会
|
||||||
this.$refs.mescroll.scrollTo(0, 0);
|
this.$nextTick(() => {
|
||||||
} else if (this.$refs.mescroll && this.$refs.mescroll.mescroll) {
|
const mescrollUni = this.$refs.mescroll && (this.$refs.mescroll.mescroll || this.$refs.mescroll);
|
||||||
this.$refs.mescroll.mescroll.scrollTo(0, 0);
|
if (mescrollUni && typeof mescrollUni.setClientHeight === 'function') {
|
||||||
|
mescrollUni.clientNum = null;
|
||||||
|
mescrollUni.isExec = false;
|
||||||
|
mescrollUni.setClientHeight();
|
||||||
}
|
}
|
||||||
}, 100);
|
});
|
||||||
// #endif
|
// #endif
|
||||||
|
|
||||||
this.waterfallflow((mescroll.num - 1) * 10);
|
this.waterfallflow((mescroll.num - 1) * 10);
|
||||||
|
|||||||
Reference in New Issue
Block a user