在基于hbuilder X 4.24创建的vue3项目中使用scroll-view组件横向滚动无作用,使用第三方的UI组件的横向滚动,也无法滚动,自己手写的代码,也无法实现横向滚动(手写的代码在普通的html文件中能实现,通用的代码),

1***@qq.com
- 发布:2024-08-06 11:33
- 更新:2024-08-06 11:46
- 阅读:394



爱豆豆 - 办法总比困难多
hbx 4.24 vue3 可以横向滚动
<template>
<view>
<scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll" scroll-left="120">
<view id="demo1" class="scroll-view-item_H uni-bg-red">A</view>
<view id="demo2" class="scroll-view-item_H uni-bg-green">B</view>
<view id="demo3" class="scroll-view-item_H uni-bg-blue">C</view>
</scroll-view>
</view>
</template>
<script setup>
</script>
<style>
.scroll-view_H {
white-space: nowrap;
width: 100%;
}
.scroll-view-item_H {
display: inline-block;
width: 100%;
height: 300rpx;
line-height: 300rpx;
text-align: center;
font-size: 36rpx;
}
.uni-bg-red {
background-color:red;
}
.uni-bg-green {
background-color: green;
}
.uni-bg-blue {
background-color: blue;
}
</style>
1***@qq.com (作者)
h5模式下能行嘛,我的不行,我之前直接复制的这个,不行
2024-08-06 12:29
爱豆豆
回复 1***@qq.com: 就是h5端的
2024-08-06 13:42
爱豆豆
会不会是浏览器的问题?你直接打开官方示例看看 能不能滚动https://hellouniapp.dcloud.net.cn/pages/component/scroll-view/scroll-view
2024-08-06 13:43