vue 横向拖动功能

<div class="group">
    <div class="resultGroup" v-for="r in resultData" :key='r.title'>
        <div class="title">{{r.title}}</div>
        <div class="num">{{r.num}}</div>
    </div>
</div>

在data里定义resultData

data() {
    return {
        resultData:[
            {num: 20, title: '单选题'},
            {num: 10, title: '多选题'},
            {num: 2, title: '判断题'},
            {num: 8, title: '判断题'},
            {num: 10, title: '简答题'},
            {num: 30, title: '主观题'},
            {num: 7, title: '客观题'},
            {num: 20, title: '易得分题'},
            {num: 15, title: '易丢分题'}
        ]
    }
}

.group{
    width: 100%;
    padding-top: 10px;
    margin-bottom: 30px;
    white-space: nowrap;
    overflow-x: auto;
    background-color: #FFFFFF;
}
.resultGroup{
    width: 20%;
    text-align: center;
    display:inline-block;
    background-color: #FFFFFF;
    .title{
        color: #FFFFFF;
        background-color: #006DFB;
        padding: 10px;
    }
    .num{
        color: #000000;
        padding: 10px;
    }
}

OK，就这样，End~