uni-app横向滚动

<template>
    <view>
        <scroll-view class="scroll-view_H" scroll-x="true" @scroll="handleScroll" 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>
    export default {
            // 横向滚动
        handleScroll(e) {
        console.log(e);
        }
        }
</script>

<style lang="scss" scoped>
    .scroll-view_H{
        white-space: nowrap;
        width: 100%;
        .scroll-view-item_H{
            display: inline-block;
            width: 100%;
            height: 150px;
            line-height: 150px;
            text-align: center;
            font-size: 18px;
            background: yellow;
        }
    }
</style>