3***@qq.com
3***@qq.com
  • 发布:2025-06-12 15:35
  • 更新:2025-06-12 16:53
  • 阅读:36

list嵌套子list无法滚动

分类:nvue

app-nvue 安卓 第一层list 里面在包裹一个list 第一个list可以正常滚动 但是第二层list无法滚动 跟scroll-view是一样的 scroll-view也是套一层之后子scroll-view无法滚动

2025-06-12 15:35 负责人:无 分享
已邀请:
爱豆豆

爱豆豆 - 办法总比困难多

看文档中说是不支持
参考文档:https://uniapp.dcloud.net.cn/component/list.html#list

之前做过一个类似的同向滚动 我用的是scroll-view+scroller 当scroller触发滚动时就把scroll-view的滚动设置禁用 下面是代码片段 你可以做个参考

test.nvue

<template>  
    <scroll-view class="content" :scroll-y="scrollY"  >  
        <block v-for="num in 20">  
            <div class="text_box">  
                <text class="title">{{num}}</text>  
                <scroller class="scroller"  @touchstart="scrollY = false"  @touchcancel="scrollY = true" @touchend="scrollY = true">  
                    <div class="row" v-for="(item,index) in 10" :key="index">  
                      <text class="text">{{item}}</text>  
                    </div>  
                  </scroller>  
            </div>  
        </block>  
    </scroll-view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                scrollY:true  
            }  
        }  
    }  
</script>  

<style>  
    .content {  
        flex: 1;  
        background-color: #007AFF;  
    }  

    .logo {  
        height: 100rpx;  
        width: 100rpx;  
        margin-top: 100rpx;  
        margin-bottom: 50rpx;  
    }  

    .title {  
        margin-top: 80rpx;  
        margin-left: 50rpx;  
        font-size: 46rpx;  
        color: #8f8f94;  
    }  
    .text_box {  
        flex-direction: row;  
        justify-content: space-between;  
        height: 200rpx;  
        background-color: #00BFFF;  
        margin-bottom: 20rpx;  
    }  

    .scroller {  
        background-color: pink;  
        width: 100rpx;  
        height: 100rpx;  
        margin-right: 50rpx;  
        margin-top: 50rpx;  
    }  

    .row {  
        height: 80rpx;  
    }  

    .text {  
        font-size: 30rpx;  
        background-color: #4CD964;  
    }  
</style>  
  • 3***@qq.com (作者)

    好的 辛苦你了 麻烦问一下 如何在app中实现组件缓存效果

    2025-06-16 10:06

要回复问题请先登录注册