vue指令只能輸入正數并且只能輸入一個小數點

rubyshen 發布于2019-08-26 12:01 / 2041人閱讀

摘要：最近在做一個金額查詢，驗證的時候總是出現很多問題，如輸入號后，框里是沒有了，但是在里還是綁定了，提交的時候就會報錯，真的是讓人很是郁悶，小數點也是框過濾掉了，但是提交的時候也會出現。

最近在做一個金額查詢，驗證的時候總是出現很多問題，如輸入-號后，input框里是沒有了，但是在model里還是綁定了，提交的時候就會報錯，真的是讓人很是郁悶，小數點也是input框過濾掉了，但是提交的時候也會出現。不過經過努力終于找到了一種解決方案，在這里``和大家分享一下下。

Vue.directive("numbers", {
  bind: function (el, binding) {
    console.log("ere")
  },
  inserted: function (el) {
    // el.querySelector("input").blur(console.log("etset"))
  },
  update: function (el, binding, vnode, oldVnode) {
    console.log("vnode", vnode)
    let express = vnode.data.directives[1].expression
    // let value = el.querySelector("input").value
    let value = vnode.data.directives[1].value
    if (typeof value === "string") {} //在重置的時候清空
    if (value.split(".").length - 1 > 1) {
      value = value.replace(/.{2,}/g, "") // 只保留第一個. 清除多余的
      value = value.replace(".", "$#$").replace(/./g, "").replace("$#$", ".")
    }
    let repeatValue = value.replace(/[^d.]/g, "")
    // setTimeout(() => {
    //   el.querySelector("input").value = repeatValue
    // }, 5)
    setValueWithExpressionVue(vnode.context.$data, express, repeatValue)
  },
  componentUpdated: function () {},
  unbind: function (el) {}
})

// 
function setValueWithExpressionVue (currObj, expression, value) {
  expression = expression.split(".")
  expression.forEach(function (arg, i) {
    if (i < expression.length - 1) {
      currObj = currObj[arg]
    } else {
      currObj[arg] = value
    }
  })
}

放到main.js里就好了，不過這個方法只能用在ivew中，平時我們經常會遇到該類型得問題。
我在后來用element-ui時輸入框得驗證中，這個方法是不能用的
該文章去年發布，一直更新不上不去，可能文章文字太少得緣故吧

GPU云服務器云服務器 js只能輸入小數 js只能輸入數據 Js只能輸入整數 asp只能輸入數字

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/108052.html

input框只允許輸入正整數、正數(包含小數)的解決方法 vue.js實現

摘要：我來打自己臉了剛剛發現在中文輸入法下是無效的有人能解決這個問題么如果要求只能輸入數字怎么做設置那我如果想限制長度，此時會失效，限制長度太麻煩了并且還存在的一個問題是，當輸入的是小數時，鼠標懸停在上會提示請輸入有效值，兩個最接近的值為和，這對我來打自己臉了!!!!...剛剛發現在中文輸入法下是無效的,有人能解決這個問題么如果要求input只能輸入數字怎么做？設置type=numbe...

el09xccxy 2019-08-23 11:51 評論0 收藏0
Vue中結合ElementUI實現：限制輸入框只能輸入正整數

摘要：中結合實現限制輸入框只能輸入正整數如果覺得對您有所幫助，麻煩您動動您的小手指給點個贊唄中禁止輸入小數和負數只允許輸入正整數做法一利用禁止按鍵的方法，主要是依靠禁止按下減號以及小數點來完成的首先要監聽鍵盤按下事件，因為上面的組件監聽事件是沒有 Vue中結合ElementUI實現：限制輸入框只能輸入正整數如果覺得對您有所幫助，麻煩您動動您的小手指給點個贊唄(*^▽^*) input中禁止...

iamyoung001 2019-08-23 12:24 評論0 收藏0
基于PHP/CURL/codeIgniter的Spider Webbot爬蟲[7]常用正則表達式

摘要：驗證是否含有等字符只能輸入漢字驗證地址驗證驗證電話號碼正確格式為，，，，，。驗證身份證號位或位數字驗證一年的個月正確格式為和驗證一個月的天正確格式為和。一、校驗數字的表達式 1 數字：^[0-9]*$ 2 n位的數字：^d{n}$ 3 至少n位的數字：^d{n,}$ 4 m-n位的數字：^d{m,n}$ 5 零和非零開頭的數字：^(0|1-9*)$ 6 非零開頭的最多帶兩位小數的數字...

wow_worktile 2019-07-01 14:10 評論0 收藏0
element el-input directive數字

摘要：使用自定義指令格式化背景使用開發的過程中遇到循環的數據只能輸入數字，并且有不要小數點，有需要小數點的使用進行控制開發頁面使用方式為保留幾位小數因為用的是的，組件外層包著一層所以要使用獲取對其監聽失使用自定義指令格式化el-input 背景使用element開發的過程中遇到循環的數據只能輸入數字，并且有不要小數點，有需要小數點的使用vue directive 進行控制showImg(...

nifhlheimr 2019-08-23 12:17 評論0 收藏0
數字在JavaScript中是如何編譯的

摘要：數字數字都是浮點數，按照標準進行存儲。因此，只有偶數可以在范圍內表示。但只有超過指數的上限才稱為中的溢出。結論在這篇博文中，我們研究了如何將其浮點數轉換為位。 JavaScript中的所有數字都是浮點數。這篇博客文章解釋了這些浮點數如何在64位二進制內部表示。由于特別考慮，本文中的數字將用整數表示，以便在閱讀本文后，您將了解在以下交互中會發生什么：（譯者注：浮點數并不一定等于小數，定...

Moxmi 2019-08-22 17:15 評論0 收藏0