vue下input监听不使用事件，type为number（数值大于0）

  • Z时代
  • 2024-03-02
  • 分类：IT

vue下input监听不使用事件，type为number（数值大于0）

vue下要求使用监听不使用事件，动态监听input为number的值，数值要求大于0的任何数，不符合的数值直接清空为null.（重点在于我输入比如0.1，还没输入完就被清空为null了）求解？

回答：

经典场景，用防抖呀～

贴一个防抖函数：

function debounce(fn, delay) {
  // 定时器
  let timer = null;
  // 将debounce处理结果当作函数返回
  return function () {
    // 保留调用时的this上下文
    let context = this;
    // 保留调用时传入的参数
    let args = arguments;
    // 每次事件被触发时，都去清除之前的旧定时器
    if (timer) {
      clearTimeout(timer);
    }
    // 设立新定时器
    timer = setTimeout(function () {
      fn.apply(context, args);
    }, delay);
  };
}

假设你监听 input 的函数是 fun，这么写：

const onInput = debounce(fun, 1000);

然后监听 input 事件触发 onInput 函数就行，这样 fun 函数在 1000ms 后才会执行。

以上是 vue下input监听不使用事件，type为number（数值大于0） 的全部内容， 来源链接： utcz.com/p/936512.html

回到顶部