最近在维护基于vux UI的移动项目中使用vux的range组件发现两个坑。在网上搜不到解决办法（可能使用人员比较少）的情况下研究这个组件源码解决我所遇到的两个问题。

问题一：
直接引用range组件出现原点拖动不了的情况。

解决方案：
1、在range组件的外层加v-if。（重点说这个） 2、查看元素层级关系

问题二：
修改绑定在range组件的V-model的data数字会出现没法累加的情况。目前出现23过渡24的时候没自动变回23。 71过渡72的时候会自动变回71。

解决方案：
在range组件中设置:step='0.5' 当然这个不是最好的解决方案是用来规避vux内置方法中计算问题。

没兴趣可以跳过以下分析源码中出现问题的原因：
问题一：

详细的思路我就不细说了关键问题的源码：

打印出来的结果是这个元素的宽度获取到的是auto。所以导致range写的计算方法出错导致拖动不了。就是说进入range 初始化时该元素宽度有问题 （我这里是因为range嵌套在 vux diolog组件导致的）

在外层加上v-if 保障我外层diolog出现以后再加载rang进行初始化。 问题解决

问题二
点击加号将range的百分数+1。发现到23的时候死活加不上去。

后来用最原始方法，console打印法找到问题的点出现在哪里，先说结论：**问题出现在vux里封装滑动条滑动距离占总距离百分比的方法里。 23-过渡到 24的计算结果是23.49145299145299 取整后又变回23。所以数字