Как изменять значение в зависимости от нажатой кнопки с определенным шагом?

Question

[Vladimir185]

Не могу додуматься, как сделать аналог input[type=number], только на Vue + Js. Шаги 0.25 сделал, только округление при нажатии на кнопки, когда, к примеру, в инпуте не значение кратное 0.25, а другое, допустим, 1.1 или 1.3, работает не так, как нужно. Как сделать, чтобы было как в input[type=number], чтобы при значении, например, 1.1 и т.д. при нажатии на кнопку минус округлялось в меньшую сторону, на плюс в большую, и значение становилось согласно шагу, т.е. в случае с 1.1 это 1 и 1.25, в случае с 1.3 это 1.25 и 1.5, с 2.6 это 2.5 и 2.75 и так далее?

Answer 1

[0xD34F]

data: () => ({
  value: 1,
  step: 0.25,
}),
methods: {
  updateValue(up) {
    const { value, step } = this;
    const rounded = Math[up ? 'floor' : 'ceil'](value / step) * step;
    this.value = rounded + step * (up ? 1 : -1);
  },
},

<input v-model.number="value">
<button @click="updateValue(0)">-</button>
<button @click="updateValue(1)">+</button>

Comments

[Vladimir185]

Спасибо!