更新记录

3.0.0（2020-12-19） 下载此版本

• 新增：
  • 挂件支持，支持在拖柄位置添加挂件
• 修复：
  1. 组件在文档流中的位置被修改导致的组件进度值异常
  2. 属性step导致的组件进度显示区域异常

2.0.0（2020-06-26） 下载此版本

由于旧版不支持NVUE，为适配NVUE此版本基于旧版重写，并且改动较大，因此重新开了一个插件发布页。

但是NVUE存在的问题较多，目前也还有部分问题没有解决，比如： 父元素设置圆角后，被裁切的部分无法隐藏子元素，导致在设置进度条为圆角时，可能会出现子元素溢出的情况，建议优化方案已在属性barBorderRadius的介绍中给出

如果有开发者知道怎么解决，望告知！！！

邮箱：1787009158@qq.com

旧版地址：https://ext.dcloud.net.cn/plugin?id=1339

平台兼容性

uni-app 自定义进度条、滑动条组件

• 属性

  参数	默认值	类型	说明
  bpname	String	新增，组件名，触发事件的返回值中会包含该组件名
  value	0	Number	设置进度条主进度的值，如50，通过动态设置该值实现进度条进度变化。
  subValue	0	Number	设置进度条副进度的值
  max	100	Number	最大值，主进度和副进度共用
  min	0	Number	最小值，主进度和副进度共用
  backgroundColor	rgba(0,0,0,0)	String	组件背景色
  activeColor	#0000ff	String	主进度条已经过区域颜色
  subActiveColor	#ffaaaa	String	副进度条已经过区域颜色
  noActiveColor	#00ffff	String	未经过区域颜色
  strokeWidth	30px	String	进度条线宽度
  width	300px	String	组件总宽，如果进度值显示在左右两边，则包括进度值在内的宽度
  showInfo	true	Boolean	是否显示进度值
  infoEndText	String	进度值显示后缀，在原有数字进度的基础上，在其后添加字符
  infoFontSize	16px	String	进度值字体尺寸
  infoColor	#000000	String	进度值字体颜色
  infoContent	value	String	进度值显示主进度值还是副进度值，有效值value、subValue
  infoAlign	right	String	进度显示位置，有效值 right center left handle, direction为vertical时，进度值只能显示在handle中
  barBorderRadius	5px	String	进度条圆角半径，注意：NVUE由于父元素设置为圆角后，被切割的圆角部分子元素无法被隐藏，因此NVUE在使用时，建议不要使用圆角，或者将isActiveCircular设置为true，使子元素也设置为同半径的圆角，但是当进度值较小时，仍会有部分溢出
  borderRadius	5px	String	整个组件的border-radius
  isActiveCircular	NVUE:true,其他:false	Boolean	主进度和副进度是否为圆角样式，半径为barBorderRadius的值
  handleColor	#ffff00	String	拖柄颜色
  handleWidth	50px	String	拖柄宽度
  handleHeight	40px	String	拖柄高度
  handleBorderRadius	5px	String	拖柄圆角半径
  handleImgUrl	String	拖柄图片
  disabled	false	Boolean	是否禁止拖动
  direction	horizontal	String	进度条方向，horizontal or vertical, 注意：设置为vertical时，infoAlign只能设置为handle才有效
  step	1	Number	主进度步长，可以为小数，它将决定进度值所保留的小数位数，步长有多少位有效小数（末尾为0不计），进度值就最多保留几位小数，注意：step将影响min和max值，如 min=0.1, step=1, 那么最小值会是0；如 min=0.1, step=0.5, max=10,那么进度的最大值会是10.1（四舍五入，max=9.8,此时最大值只能到9.6）,并且可能造成进度条达不到最大值就不能滑动的情况，因此若要完全从设置的min值变化到max,步长应该被max-min整除
  subStep	1	Number	副进度步长
  continuous	true	Boolean	主进度进度条是否连续滑动，true连续滑动，false步进，即以step的间隔变化
  subContinuous	true	Boolean	副进度进度条是否连续滑动，true连续滑动，false步进，即以step的间隔变化
  reverse	false	Boolean	进度是否反转，为false时，进度条从左向右滑动，进度值向max靠近，为true时，向min靠近
  widgetPos	top	String	新增，NVUE不支持，挂件在拖柄的什么位置 top, right, bottom, left
  widgetHeight	40px	String,Number	新增，NVUE不支持，挂件的高
  widgetWidth	50px	String,Number	新增，NVUE不支持，挂件的宽
  widgetBorderRadius	5px	String,Number	新增，NVUE不支持，挂件的圆角半径
  widgetOpacity	1	Number	新增，NVUE不支持，挂件的不透明度 0完全透明 1不透明
  widgetOffset	'0px'	Number	新增，NVUE不支持，挂件距离组件的偏移量，正数原理组件，负数靠近组件
  widgetUrl	String	新增，NVUE不支持，挂件图片
  widgetAngle	Number	新增，NVUE不支持，挂件旋转角度

• 插槽

  • 支持通过插槽自定义挂件，使用插槽自定义挂件时，不能设置 widgetUrl 属性，注意修改属性 widgetHeigh 和 widgetWidth，使其与你的挂件一致

• 事件

  事件	返回参数	说明
  change	bpname:组件名，组件绑定的bpname的值,type:change, value:主进度值, sunValue: 副进度值	进度条进度变化触发
  valuechange	bpname:组件名，组件绑定的bpname的值,type:change, value:主进度值, sunValue: 副进度值	主进度条进度变化触发，同时会触发change
  subvaluechange	bpname:组件名，组件绑定的bpname的值,type:change, value:主进度值, sunValue: 副进度值	副进度条进度变化触发，同时会触发change
  dragstart	bpname:组件名，组件绑定的bpname的值,type:dragstart, value:主进度值, sunValue: 副进度值	手指接触进度条触发
  dragging	bpname:组件名，组件绑定的bpname的值,type:dragging, value:主进度值, sunValue: 副进度值	拖拽进度条触发
  dragend	bpname:组件名，组件绑定的bpname的值,type:dragend, value:主进度值, sunValue: 副进度值	拖拽完成手指离开屏幕触发