vue可拖动水平进度条组件
需要一个可拖动并能设置最大最小值及步长的进度条，所以问了度娘，参考了很多网友写的进度条的代码，终于搞出了这个进度条组件，pc端和移动端均可用。
【vue可拖动水平进度条组件】代码：
{{ num }}* {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.progress-bar {
text-align: left;
.mask {
width: 320px;
height: 20px;
background-color: #dddddd;
border-radius: 10px;
position: absolute;
}
.bar {
height: 20px;
background-color: #1069db;
position: absolute;
z-index: 2;
border-radius: 10px;
bottom: 0;
left: 0;
}
.point {
width: 24px;
height: 24px;
border-radius: 50%;
border: 1px solid #1069db;
position: absolute;
bottom: -3px;
left: 0;
z-index: 3;
background-color: white;
}
.num {
text-align: center;
padding-bottom: 20px;
}
}组件使用方法：
//例如:推荐阅读
- vue-cli|vue-cli 3.x vue.config.js 配置
- 2020-04-07vue中Axios的封装和API接口的管理
- 2019-1-14
- 抑郁症（可怕吗？）
- 松软可口易消化，无需烤箱超简单，新手麻麻也能轻松成功~
- 你不可不知的真相系列之科学
- 关于自我为中心的一点感想
- 为什么孩子一定要学会可视化思维！
- 唐嫣可真会穿，西装搭牛仔裤都能穿出高级感，一双大长腿太抢镜
- 我怀孕了可是我失业了，孕期生活，到底该何去何从（）