Vue3 Div 与 v-for 的配合应用,超出自动带滚动条

效果图

 代码

复制代码
<li  >
    <a href="javascript:;" class="IndRea flexC Huans"><i></i><p>当前会议 [ 0 ]</p></a>
    <div style="height:80%;overflow:auto;">
    
       <div  v-for="(dataItem, index) in globalData.confMemberData"  :key="index" class="dataFontStyle"  >
                 {{dataItem.userExten}} {{dataItem.userName}}  {{dataItem.callStatus}} 
       </div>
 
   </div>
</li>
复制代码
其中 globalData.confMemberData 为全局json变量。 详见:https://www.cnblogs.com/hailexuexi/p/17649247.html
overflow:auto;  滚动条自动显示
CSS 部分
.dataFontStyle {
    font-family: 'Microsoft YaHei'; 
    color: #FFD700; 
    font-size: 14px; 
    line-height: 24px; 
    font-weight: normal; 
}

 

posted @   海乐学习  阅读(221)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· 上周热点回顾(2.24-3.2)
点击右上角即可分享
微信分享提示