uview-plus
uview-plus copied to clipboard
ijry
cate-tab在的小程序无法使用功能
问题描述 清晰地描述该错误是什么，请不要直接贴一张图或者一句话描述，需要提供尽可能多的信息才能便于问题定位，特别是连个版本号都没有的无从下手。
cate-tab组件在h5正常使用，微信小程序就只能做展示，左侧分类列表点击无效果，分类跟随页面滚动
https://github.com/user-attachments/assets/6864981f-8279-484a-9a45-1d1b2072558e
复现步骤 复现该行为的步骤：
- 前往'...'
- 点击'....'
- 滚动到'....'
- 查看错误
预期行为 清晰地描述你期望发生什么。 正常使用 截图 如果适用，请添加截图以帮助解释你的问题。
版本（请填写以下信息）：
- HBuilderX：[例如 4.24]
- uview-plus：[例如 3.3.8]
- 开发者工具版本：[例如 微信开发者工具1.0.1]
"dependencies": {
"@dcloudio/uni-app": "3.0.0-4040520250104002",
"@dcloudio/uni-app-harmony": "3.0.0-4040520250104002",
"@dcloudio/uni-app-plus": "3.0.0-4040520250104002",
"@dcloudio/uni-components": "3.0.0-4040520250104002",
"@dcloudio/uni-h5": "3.0.0-4040520250104002",
"@dcloudio/uni-mp-alipay": "3.0.0-4040520250104002",
"@dcloudio/uni-mp-baidu": "3.0.0-4040520250104002",
"@dcloudio/uni-mp-jd": "3.0.0-4040520250104002",
"@dcloudio/uni-mp-kuaishou": "3.0.0-4040520250104002",
"@dcloudio/uni-mp-lark": "3.0.0-4040520250104002",
"@dcloudio/uni-mp-qq": "3.0.0-4040520250104002",
"@dcloudio/uni-mp-toutiao": "3.0.0-4040520250104002",
"@dcloudio/uni-mp-weixin": "3.0.0-4040520250104002",
"@dcloudio/uni-mp-xhs": "3.0.0-4040520250104002",
"@dcloudio/uni-quickapp-webview": "3.0.0-4040520250104002",
"@dcloudio/uni-ui": "^1.5.7",
"@uni-helper/axios-adapter": "^1.5.2",
"axios": "^1.7.9",
"axios-miniprogram-adapter": "^0.3.5",
"clipboard": "^2.0.11",
"cos-wx-sdk-v5": "^1.7.2",
"dayjs": "^1.11.13",
"uview-plus": "^3.3.65",
"uview-ui": "^2.0.38",
"vue": "3.4.21",
"vue-i18n": "9.14.2"
},
"devDependencies": {
"@dcloudio/types": "3.4.14",
"@dcloudio/uni-automator": "3.0.0-4040520250104002",
"@dcloudio/uni-cli-shared": "3.0.0-4040520250104002",
"@dcloudio/uni-stacktracey": "3.0.0-4040520250104002",
"@dcloudio/vite-plugin-uni": "3.0.0-4040520250104002",
"@uview-plus/types": "^3.2.5",
"@vue/runtime-core": "3.5.13",
"@vue/tsconfig": "^0.1.3",
"sass": "^1.63.2",
"sass-loader": "^8.0.2",
"typescript": "^4.9.4",
"vite": "5.2.8",
"vue-tsc": "^1.0.24"
}
平台（请填写以下信息）：
- 平台：[例如 微信小程序iOS] 微信小程序开发者工具
智能手机（请填写以下信息）：
- 设备：[例如 iPhone6]
- 操作系统：[例如 iOS8.1] 其他上下文 在此处添加有关问题的任何其他上下文。
给组件一个高度了没？
<template>
<view style="height: 100%">
<up-cate-tab class="cate-tab" :tabList="categoriesList" tabKeyName="name" itemKeyName="name">
<template #pageItem="{pageItem}">
<view class="w-full" style="width: 100%;">
<up-cell-group :border='false'>
<up-cell @click="goQuestion(pageItem.id, pageItem.title)">
<template #icon >
<up-image :src="pageItem.evaluationImg.url" width="100px" height="100px"></up-image>
</template>
<template v-slot:title >
<view style="display: flex;flex-direction: column;justify-content: space-around;height: 100px;width: 150px">
<view style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
{{ pageItem.title }}
</view>
<view style="color: #9a9a9a; font-size: 24rpx;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
{{ pageItem.content }}
</view>
<view style=" font-size: 22rpx">
{{ pageItem.count }}人已做测评
</view>
</view>
</template>
</up-cell>
</up-cell-group>
</view>
</template>
</up-cate-tab>
</view>
</template>
<style scoped>
.cate-tab {
height: 100vh;
}
</style>
你看是这样吗？没有效果，分类的点击也没有用
这是数据结构
{
"code": 200,
"message": null,
"data": [
{
"id": "0",
"name": "基础",
"children": [
{
"id": "1",
"title": "测试11111111111111111",
"content": "测试测试测试",
"categoriesId": "0",
"isMbti": 0,
"evaluationImg": {
"id": "1",
"url": "https://inews.gtimg.com/om_bt/OZd59Ufvp_sQDd4WMU20Dq9Fq2rNSPsu4EMn2mGcuXZBUAA/641",
"evaluationId": "1"
},
"count": 21,
"categories": null
},
{
"id": "2",
"title": "asdas",
"content": "aaaaaaa",
"categoriesId": "0",
"isMbti": 0,
"evaluationImg": {
"id": "2",
"url": "https://inews.gtimg.com/om_bt/OZd59Ufvp_sQDd4WMU20Dq9Fq2rNSPsu4EMn2mGcuXZBUAA/641",
"evaluationId": "2"
},
"count": 0,
"categories": null
},
{
"id": "42b44a635afb4df384c6be3ff77f3236",
"title": "哈哈哈哈哈",
"content": "哈哈哈哈哈",
"categoriesId": "0",
"isMbti": 0,
"evaluationImg": {
"id": "1889240055995289602",
"url": "https://scf-deploy-ap-chengdu-1300475487.cos.ap-chengdu.myqcloud.com/57469-230323193210V6.png",
"evaluationId": "42b44a635afb4df384c6be3ff77f3236"
},
"count": 0,
"categories": null
},
{
"id": "bf4ced04c1ce42ccbcf7f14640d2bdca",
"title": "1",
"content": "1",
"categoriesId": "0",
"isMbti": 0,
"evaluationImg": {
"id": "1889146903091224578",
"url": "https://scf-deploy-ap-chengdu-1300475487.cos.ap-chengdu.myqcloud.com/57469-230323193210V6.png",
"evaluationId": "bf4ced04c1ce42ccbcf7f14640d2bdca"
},
"count": 0,
"categories": null
},
{
"id": "ef877a69f22445849143a2beeca8084c",
"title": "123",
"content": "asasd",
"categoriesId": "0",
"isMbti": 0,
"evaluationImg": {
"id": "1889150646075609089",
"url": "https://scf-deploy-ap-chengdu-1300475487.cos.ap-chengdu.myqcloud.com/57469-230323193210V6.png",
"evaluationId": "ef877a69f22445849143a2beeca8084c"
},
"count": 0,
"categories": null
}
]
},
{
"id": "099c9bc5c34d4cc19808f849aa7db2ec",
"name": "测试",
"children": [
]
},
{
"id": "1",
"name": "MBTI",
"children": [
{
"id": "3",
"title": "MBTI测试",
"content": "MBTI职业性格测试题",
"categoriesId": "1",
"isMbti": 1,
"evaluationImg": {
"id": "3",
"url": "https://inews.gtimg.com/om_bt/OZd59Ufvp_sQDd4WMU20Dq9Fq2rNSPsu4EMn2mGcuXZBUAA/641",
"evaluationId": "3"
},
"count": 5,
"categories": null
}
]
},
{
"id": "b2bc13c2c2b04350ac8b8b82c8a42f64",
"name": "你好",
"children": [
]
},
{
"id": "ef632ea0e561482f9096cb8ab753678e",
"name": "霍兰德职业性格测试",
"children": [
{
"id": "4",
"title": "霍兰德职业性格测试",
"content": "霍兰德职业性格测试",
"categoriesId": "ef632ea0e561482f9096cb8ab753678e",
"isMbti": 0,
"evaluationImg": {
"id": "4",
"url": "https://inews.gtimg.com/om_bt/OZd59Ufvp_sQDd4WMU20Dq9Fq2rNSPsu4EMn2mGcuXZBUAA/641",
"evaluationId": "4"
},
"count": 5,
"categories": null
}
]
}
]
}
+1，请问最后解决了吗，怎么解决的？
.cate-tab:deep(.u-cate-tab){
height: 100vh;
}
使用穿透给组件内部的u-cate-tab设置高度即可