vue移动端可以左右滑动的滑块

//vue移动端可以左右滑动的滑块，百度看了好多，都是要下载v-touch来实现，总感觉不是很方便，所以用了css的方法来实现，下面是代码！！！
<template>
  <div>
   <div class="lateral-sliding">
    <div class="lateral-sliding-item">
      <div class="each">
        <span>户型</span>
        <span>三居</span>
      </div>
      <div class="each">
        <span>面积</span>
        <span>135m</span>
      </div>
      <div class="each">
        <span>地区</span>
        <span>保定</span>
      </div>
      <div class="each">
        <span>风格</span>
        <span>中式现代</span>
      </div>
      <div class="each">
        <span>预算</span>
        <span>6万</span>
      </div>
      <div class="each">
        <span>方式</span>
        <span>半包</span>
      </div>
    </div>
  </div>
  </div>
</template>

CSS

.lateral-sliding {
  width: 320px;
  height: 70px;
  border-radius:10px;
  border: 1px solid #888;
  display: flex;
  margin: 0 auto;
  overflow-y: hidden;
  overflow-x: scroll;
}
.lateral-sliding-item {
  display: flex;
  margin-right: 8px;
  background-color: #fff;
}
.each{
  width: 60px;
  display: flex;
  /* line-height: 30px; */
  flex-direction: column;
}
.each span{
  font-size: 12px;
  line-height: 20px;
  margin-top: 10px;
}

效果图