vue数字输入框如何输入整数 - 豆丁海马科技【官网】

1：通过watch监听数据的变化返回整数

{
data:{
  number:0
}
watch:{
  number(newValue,oldValue){
     this.number=parsInt(newValue)
  }
 }
}

2:通过给input输入框绑定钩子函数

例如 <input v-model=”number” v-‘自定义指令’>

Vue.direactives('自定义指令',{
inserted(el, binding, vnode, oldVnode){
  el.addEventListener('keypress', function (e) {
          e = e || window.event;
          let charcode = e.key;
          let re = /\d/;
          if (!re.test(charcode) && !e.ctrlKey) {
            if (e.preventDefault) {
              e.preventDefault();
            } else {
              e.returnValue = false;
            }
          }
    });
  }
})

Vue中的bind和insert的区别

共同点： dom插入都会调用，bind在inserted之前

不同点：

bind 时父节点为 null

inserted 时父节点存在。

bind是在dom树绘制前调用，inserted在dom树绘制后调用