vant2开发遇到的问题----van-popup里面使用van-list无法设置指定高度

最新推荐文章于 2024-07-17 15:35:12 发布

jueshileqishou01

最新推荐文章于 2024-07-17 15:35:12 发布

阅读量1.6k

点赞数

文章标签： html css 前端

本文链接：https://blog.csdn.net/jueshileqishou01/article/details/127450492

版权

问题描述：弹窗里面有一个一半高度的区域滚动，现在是这个一半高度无法设置

问题详情：弹窗400px，区域滚动200px,现在问题是区域滚动一直无法指定为200px

解决：

  overflow-y: scroll; //父元素要手动设置滚动条

代码：

 <div  class="box-vanlist">
            <van-list
            v-model="loading"
            :finished="finished"
            finished-text="没有更多了"
            @load="loadMore"
            style="width:100%;height:100%"
            >
            <div class="box-list">
              <div class="box-item" v-for="(item,index) in listData" :key="index">
                  <img class="box-item-img" src="../static/default.png" alt="" srcset="">
              </div>
            </div>
          </van-list>
       </div>

css:

    .box-vanlist{
      width: 8.267rem;
      height: 5.333rem;
      overflow-y: scroll; //设置这个 才能指定高度
      .box-list{
        display: flex;
        flex-direction: column;
        align-items: center;
      }
      box-item{
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 7.2rem;
        height: 1.333rem;
        background: #4E63A6;
        margin-bottom: 0.667rem;
        border-radius: 0.16rem;
        box-item-img{
          margin-left: 0.187rem;
          width: 0.667rem;
          height: 0.667rem;
        }
      }
    }