学习要点:
 1.滑块模块
 本节课我们来开始了解 Layui 的内置模块:滑块模块。
 一.滑块模块
 1. 滑块模块,即鼠标拖动一滚动条来获取数值,先来看下基本设置;
 <div id="test"></div>
 layui.use(['slider'], () => {
 const slider = layui.slider
 //实例化
 slider.render({
 //绑定 dom
 elem : '#test',
 })
 })
 2. 对于参数,下面列出比较常用的属性,更多参考手册:
 属性 描述
 elem 容器选择器,DOM 对象
 type 类型,默认:default(水平)、vertical(垂直)
 min 最小值,默认 0
 max 最大值,默认 100
 range 是否开启滑块范围拖拽
 value 初始值
 step 步长
 showstep 是否显示间断点
 tips 是否显示文字提示
 input 是否显示输入框
 disabled 是否禁用
 theme 主题色
 //实例化
 slider.render({
 //绑定 dom
 elem : '#test',
 range : false,
 value : 20,
 tips : false,
 input : true,
 })
 3. 自定义 tips 的方法:setTips,以及回调 change 方法;
 //自定义文本
 setTips(value) {
 return value + '%'
 }
 //回调
 change(value) {
 console.log(value)
 }










