scroll-view取消滚动条

Mi Manchi

已于 2024-07-29 11:18:20 修改

阅读量557

点赞数 4

文章标签：前端 javascript

于 2024-07-29 11:16:16 首次发布

本文链接：https://blog.csdn.net/2302_77005870/article/details/140766530

版权

<scroll-view class="message_content" id="message" scroll-y="true" :show-scrollbar="false"
               :scroll-into-view="last_id">
               <view v-for="(message, index) in messages" :key="index" :class="['message-item', message.type]"
                   :id="'dom'+index">
                   <image :src="message.content" class="message-content" ></image>
               </view>
           </scroll-view>

在scroll-view的类名下直接添加如下代码

               ::-webkit-scrollbar {
                   display: none;
                   width: 0 !important;
                   height: 0 !important;
                   -webkit-appearance: none;
                   background: transparent;
                   color: transparent;
               }

效果如下

           .message_content {
               ::-webkit-scrollbar {
                   display: none;
                   width: 0 !important;
                   height: 0 !important;
                   -webkit-appearance: none;
                   background: transparent;
                   color: transparent;
               }

}