Javascript 如何使按钮在某一点后改变其步长而不失去价值？

我希望在网页上创建一个按钮，该按钮在某个值之后将开始有一个“2”的步骤。
目前我正在使用的JS框架是vue.JS，以下是我目前使用的：

<input :step="something >= 5 ? 2 : 1" type="number" >

：before步骤是vue.js中v-bind的简写。 现在，我的问题是，一旦我的值为5，阶梯也将为2，当我希望用户能够选择4，而不必通过值3然后4

或者，我想我可以生成一个数字数组，但我不知道如何在这个过程中引入2的步骤。

---

类似这样的东西[1,2,3,4,5,7,9,11,13…]

您可以通过编程实现

更新为使用手表并管理“编辑”模式，以便我们在键入时更改值

<template>
  <div id="app">
    <input :step="1" type="number" v-model="something" @keydown="keydown" />
    {{ editing }}
  </div>
</template>

<script>
export default {
  name: "App",
  data: function() {
    return {
      something: 0,
      last: 0,
      editing: false
    };
  },
  methods: {
    keydown(e) {
      this.editing = e.key !== "Enter";
      if (!this.editing) {
        this.validateSomething(Number(this.something));
      }
    },
    validateSomething(v) {
      if (v > 5) {
        if (v % 2 === 0) {
          if (v > this.last) {
            this.something = v + 1;
          } else {
            this.something = v - 1;
          }
        }
      }
      this.last = this.something;
    }
  },
  watch: {
    something: function(newVal, oldVal) {
      console.log(newVal, oldVal);
      let v = Number(newVal);
      if (!this.editing) {
        this.validateSomething(v);
      }
    }
  }
};
</script>

{{编辑}
导出默认值{
名称：“应用程序”，
数据：函数（）{
返回{
某物：0，
最后:0,，
编辑：假
};
},
方法：{
按键向下（e）{
this.editing=e.key！=“回车”；
如果（！this.editing）{
this.validateMething（数字（this.something））；
}
},
验证方法（v）{
如果（v>5）{
如果（v%2==0）{
如果（v>this.last）{
this.something=v+1；
}否则{
this.something=v-1；
}
}
}
this.last=this.something；
}
},
观察：{
某物：函数（newVal，oldVal）{
console.log（newVal、oldVal）；
设v=数字（newVal）；
如果（！this.editing）{
这是验证方法（v）；
}
}
}
};

---

这是一个有效的代码沙盒：

这几乎是误用了

步骤

属性，我认为如果没有一些脆弱的、黑客式的代码，你将无法做你想做的事情。您可以创建一个自定义组件来执行类似的操作，而无需使用输入元素，但除此之外，我认为不会有一个好的解决方案。我明白了，我认为我以错误的方式看待问题。我应该简单地创建两个数组，一个步长为1，另一个步长为2，并将它们连接在一起。谢谢你这么快回复！这里唯一的问题是：如果用户想要手动输入一个数字怎么办？如果我尝试键入81，在我完成键入之前，它首先会从8变为9。我更新为使用@change。不过有时候我会有点迟钝。仍在调查…在“真的需要管理我的强迫症”类别中，我更新了一个版本，该版本不会直接干扰键入数字。非常感谢@JimB。这非常有用。我仍然有一个问题，如果我的按钮已经有了一个不同的v型，有没有办法让我仍然做到这一点？你应该能够使用相同的v型<代码>某些东西只是一个占位符。