安装:

npm install vue-slider-component

<template>
<div>
<vue-slider v-model="value" :min="min" :max="max" :interval="step" :tooltip="false" @callback="change()"></vue-slider>
 </div>
</template>
<script>
import vueSlider from 'vue-slider-component'; export default {
components: {
vueSlider
},
data () {
return {
value: 0,
    min: 0,
    max: 10,
    step: 1
}
},
  methods: {
    change(){
    }
  }
} </script>

详细文档见:https://nightcatsama.github.io/vue-slider-component/example/#QuickStart

移动端比较好用的滑动条 vue-slider-component的更多相关文章

  1. VC++ 中滑动条(slider控件)使用 [转+补充]

    滑动控件slider是Windows中最常用的控件之一.一般而言它是由一个滑动条,一个滑块和可选的刻度组成,用户可以通过移动滑块在相应的控件中显示对应的值.通常,在滑动控件附近一定有标签控件或编辑框控 ...

  2. 【WPF】点击滑动条(Slider),移动滑块(Tick)到鼠标点击的位置

    问题:点击Slider控件时,滑块会自动跳到滑动条的最边缘位置,无法跳到鼠标点击的位置上. 办法:给Slider控件设置属性IsMoveToPointEnabled="True"即 ...

  3. WP8滑动条(Slider)控件的使用

    1. <Grid x:Name="LayoutRoot" Background="Transparent"> <Grid.RowDefinit ...

  4. 疯狂JAVA讲义---第十二章:Swing编程(五)进度条和滑动条

    http://blog.csdn.net/terryzero/article/details/3797782 疯狂JAVA讲义---第十二章:Swing编程(五)进度条和滑动条 标签: swing编程 ...

  5. IOS开发-UI学习-UISlider(滑动条)的使用

    滑动条即UISlider,是我们常见的软件中设置音量,亮度等的滑条,初始化及基本设置如下: // 新建滑动条 UISlider *slider = [[UISlider alloc]initWithF ...

  6. 移动端 微信 网易 触屏滑动回弹菜单(css版)

    总结一下: 有点:网易新闻,微信 热文 都是 -webkit-overflow-scrolling: touch;实现,css实现,轻巧: bug: 部分安卓浏览器(uc,自带)  只支持持续滑动,不 ...

  7. IE10和IE11中滑动条遮挡页面问题

    今天在开发的过程中前端项目,在小设备上会出现滑动条,这本没什么,在其他浏览器上都很正常,但是在IE10和IE11上出现了问题,发现侧边滑动条挡住了一部分页面的内容,因为侧边有要操作的按钮,这就是一个很 ...

  8. 给div"上"滑动条

    最近做项目时修改一个遗留的bug,大概是这样:有一个聊天窗口,用户聊天内容展现在窗口上.其实这个窗口是一个带滑动条的div,随着聊天内容的添加,滑动条也越来越长了,这不是重点,重点是每次刷新窗口时候, ...

  9. 【JavaScript吉光片羽】--- 滑动条

    灯光的亮度控制需要一个滑动条,先借用lamp源码中Bar: var Bar = function (opt) { var defaults = { $id: "", // 进度条d ...

随机推荐

  1. lombok踩坑与思考

    虽然接触到lombok已经有很长时间,但是大量使用lombok以减少代码编写还是在新团队编写新代码维护老代码中遇到的. 我个人并不主张使用lombok,其带来的代价足以抵消其便利,但是由于团队编码风格 ...

  2. 如何引入.graphql文件并优雅的使用fragment

    你还在为代码中放入长长的模版字符串所苦恼吗,如下图代码片段: ps:这个是grqphql client在nodejs后端项目的实践,如果你是在前端使用graphql,并使用了webpack,那么这些问 ...

  3. Maven 打包项目 部署到服务器 重启服务 插件

    1.maven插件wagon-maven-plugin自动部署远程Linux服务器  (http://xxgblog.com/2015/10/23/wagon-maven-plugin/) <p ...

  4. Analysis of Servlet

    @WebServlet("/cdiservlet") public class NewServlet extends HttpServlet { private Message m ...

  5. 大数据入门到精通19--mysql 数据导入到hive数据中

    一.正常按照数据库和表导入 \\前面介绍了通过底层文件得形式导入到hive的表中,或者直接导入到hdfs中,\\现在介绍通过hive的database和table命令来从上层操作.sqoop impo ...

  6. 【IDEA】关于idea开发工具使用

    idea这个开发工具有很强大的功能,然鹅有时候某些地方需要注意...(注明一下,我的版本2017.3.2因为不知道新版本有木有优化) 先说说建包,比如我在src下建了个com.xxxxx.test的包 ...

  7. springboot+maven整合spring security

    springboot+maven整合spring security已经做了两次了,然而还是不太熟悉,这里针对后台简单记录一下需要做哪些事情,具体的步骤怎么操作网上都有,不再赘述.1.pom.xml中添 ...

  8. BurpSuite抓HTTPS包

    Burp Suite要抓HTTPS的包的话,是需要有Burp Suite的CA证书的 为什么要证书这里就不说了,下面是具体步骤 1.首先要把Burp Suite的CA证书下载到本地 Burp Suit ...

  9. 20175314薛勐 Arrays和String单元测试

    Arrays和String单元测试(课下作业,选做) 要求 在IDEA中以TDD的方式对String类和Arrays类进行学习 测试相关方法的正常,错误和边界情况 String类 CharAt Spl ...

  10. input下拉框

    用Html5和css.js写的,引用的bootstrap和jquery文件请各位看客自己去下载