Vuetify: Slider with step not start with the right value

Created on 11 Jul 2018  路  1Comment  路  Source: vuetifyjs/vuetify

Hello guys!

Versions and Environment

Vuetify: 1.1.1
Vue: 2.5.2
Browsers: Chrome, Firefox
OS: Ubuntu 16.04

Expected Behavior

I want to use Slider with :

  • min = 45
  • step = 2

So, get values like 45, 47, 49....

Actual Behavior

Actually, it start at 46 not 45

Reproduction Link

Codepen

has PR bug

Most helpful comment

The problem is in the roundValue (value) method of VSlider component:

roundValue (value) {
  if (!this.stepNumeric) return value
  // Format input value using the same number
  // of decimals places as in the step prop
  const trimmedStep = this.step.toString().trim()
  const decimals = trimmedStep.indexOf('.') > -1
    ? (trimmedStep.length - trimmedStep.indexOf('.') - 1)
    : 0

  const newValue = Math.round(value / this.stepNumeric) * this.stepNumeric

  return parseFloat(Math.min(newValue, this.max).toFixed(decimals))
},

>All comments

The problem is in the roundValue (value) method of VSlider component:

roundValue (value) {
  if (!this.stepNumeric) return value
  // Format input value using the same number
  // of decimals places as in the step prop
  const trimmedStep = this.step.toString().trim()
  const decimals = trimmedStep.indexOf('.') > -1
    ? (trimmedStep.length - trimmedStep.indexOf('.') - 1)
    : 0

  const newValue = Math.round(value / this.stepNumeric) * this.stepNumeric

  return parseFloat(Math.min(newValue, this.max).toFixed(decimals))
},
Was this page helpful?
0 / 5 - 0 ratings

Related issues

efootstep picture efootstep  路  3Comments

cawa-93 picture cawa-93  路  3Comments

radicaled picture radicaled  路  3Comments

Webifi picture Webifi  路  3Comments

aaronjpitts picture aaronjpitts  路  3Comments