fix: 移动端目录上下滑动不顺畅

This commit is contained in:
fit2cloud-chenyw 2022-01-04 11:48:04 +08:00
parent 834657e570
commit 8152b53b2f
4 changed files with 83 additions and 103 deletions

17
mobile/.gitignore vendored Normal file
View File

@ -0,0 +1,17 @@
.DS_Store
node_modules/
dist/
npm-debug.log*
yarn-debug.log*
yarn-error.log*
package-lock.json
tests/**/coverage/
# Editor directories and files
.hbuilderx
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln

View File

@ -1,23 +1,28 @@
<template> <template>
<view class="page dataease-main"> <view class="page">
<swiper indicator-dots="true">
<swiper-item v-for="(img, key) in imgUrls" :key="key"><image :src="img" /></swiper-item>
</swiper>
<view class=" ">
<view class="uni-title">
<uni-list >
<uni-list-item v-for="(node, index) in nodes" :key="index"
:title="node.text"
:showArrow="node.type === 'folder'"
:thumb="node.type === 'folder' ? '../../../static/folder.png' : '../../../static/yibiaobans.png'"
thumb-size="base"
clickable
@click="clickHandler(node)"
rightText="" />
</uni-list>
<swiper class="swiper-box" style="flex: 1;" :duration="300" > </view>
<swiper-item class="swiper-item" > </view>
<uni-list > <!-- <view style="height: 1000rpx;"></view> -->
<uni-list-item v-for="(node, index) in nodes" :key="index"
:title="node.text"
:showArrow="node.type === 'folder'"
:thumb="node.type === 'folder' ? '../../../static/folder.png' : '../../../static/yibiaobans.png'"
thumb-size="base"
clickable
@click="clickHandler(node)"
rightText="" />
</uni-list>
</swiper-item>
</swiper>
</view> </view>
</template> </template>
@ -28,18 +33,17 @@ export default {
return { return {
showSwiper: false, showSwiper: false,
imgUrls: [ imgUrls: [
'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/b4b60b10-5168-11eb-bd01-97bc1429a9ff.jpg', '../../../static/panelimg/panel2.png',
'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/b1dcfa70-5168-11eb-bd01-97bc1429a9ff.jpg' '../../../static/panelimg/panel1.png'
], ],
nodes: []
nodes: []
}; };
}, },
onLoad() { onLoad() {
setTimeout(()=>{ setTimeout(()=>{
this.loadData('panel_list'); this.loadData('panel_list');
},350) },350)
}, },
/** /**
* searchInput 配置 disabled true 时触发 * searchInput 配置 disabled true 时触发
*/ */
@ -48,54 +52,40 @@ export default {
url: './search' url: './search'
}); });
}, },
onPullDownRefresh() { onPullDownRefresh() {
this.loadData('panel_list'); this.loadData('panel_list');
}, },
/**
* 点击导航栏 buttons 时触发 methods: {
*/ loadData(pid) {
/* onNavigationBarButtonTap() { pid = pid || 'panel_list'
uni.showModal({ const param = {pid: pid}
title: '提示',
content: '用户点击了功能按钮,这里仅做展示。', requestDir(param).then(res => {
success: res => { this.nodes = res.data
if (res.confirm) { uni.stopPullDownRefresh();
console.log('用户点击了确定'); }).catch(e => {
} uni.stopPullDownRefresh();
} })
}); },
} */ clickHandler(node) {
const param = {
methods: { id: node.id,
loadData(pid) { title: node.text,
pid = pid || 'panel_list' index: 4
const param = {pid: pid} }
if(node.type === 'panel') {
requestDir(param).then(res => {
this.nodes = res.data uni.navigateTo({
uni.stopPullDownRefresh(); url: '../home/detail?detailDate=' + encodeURIComponent(JSON.stringify(param))
}).catch(e => { });
uni.stopPullDownRefresh(); return
}) }
}, uni.navigateTo({
clickHandler(node) { url: './folder?detailDate=' + encodeURIComponent(JSON.stringify(param))
const param = { });
id: node.id, }
title: node.text, }
index: 4
}
if(node.type === 'panel') {
uni.navigateTo({
url: '../home/detail?detailDate=' + encodeURIComponent(JSON.stringify(param))
});
return
}
uni.navigateTo({
url: './folder?detailDate=' + encodeURIComponent(JSON.stringify(param))
});
}
}
}; };
</script> </script>
@ -110,31 +100,4 @@ swiper,
.page-section-title { .page-section-title {
margin-top: 50rpx; margin-top: 50rpx;
} }
.dataease-main {
position: fixed;
left: var(--window-left);
right: var(--window-right);
top: 40px;
padding: 5px;
height: calc(100vh - 90px);
}
.swiper-box {
flex: 1;
background-color: #ffffff;
height: calc(100vh - 100px);
}
.swiper-item {
flex: 1;
flex-direction: row;
}
.uni-list {
overflow-y: scroll;
height: calc(100vh - 100px);
}
</style> </style>

Binary file not shown.

After

Width:  |  Height:  |  Size: 276 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB