成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專(zhuān)欄INFORMATION COLUMN

vue指令只能輸入正數(shù)并且只能輸入一個(gè)小數(shù)點(diǎn)

rubyshen / 2042人閱讀

摘要:最近在做一個(gè)金額查詢,驗(yàn)證的時(shí)候總是出現(xiàn)很多問(wèn)題,如輸入號(hào)后,框里是沒(méi)有了,但是在里還是綁定了,提交的時(shí)候就會(huì)報(bào)錯(cuò),真的是讓人很是郁悶,小數(shù)點(diǎn)也是框過(guò)濾掉了,但是提交的時(shí)候也會(huì)出現(xiàn)。

最近在做一個(gè)金額查詢,驗(yàn)證的時(shí)候總是出現(xiàn)很多問(wèn)題,如輸入-號(hào)后,input框里是沒(méi)有了,但是在model里還是綁定了,提交的時(shí)候就會(huì)報(bào)錯(cuò),真的是讓人很是郁悶,小數(shù)點(diǎn)也是input框過(guò)濾掉了,但是提交的時(shí)候也會(huì)出現(xiàn)。不過(guò)經(jīng)過(guò)努力終于找到了一種解決方案,在這里``和大家分享一下下。

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") {} //在重置的時(shí)候清空
    if (value.split(".").length - 1 > 1) {
      value = value.replace(/.{2,}/g, "") // 只保留第一個(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里就好了,不過(guò)這個(gè)方法只能用在ivew中,平時(shí)我們經(jīng)常會(huì)遇到該類(lèi)型得問(wèn)題。
我在后來(lái)用element-ui時(shí)輸入框得驗(yàn)證中,這個(gè)方法是不能用的
該文章去年發(fā)布,一直更新不上不去,可能文章文字太少得緣故吧

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/108052.html

相關(guān)文章

  • input框只允許輸入正整數(shù)、正數(shù)(包含小數(shù))的解決方法 vue.js實(shí)現(xiàn)

    摘要:我來(lái)打自己臉了剛剛發(fā)現(xiàn)在中文輸入法下是無(wú)效的有人能解決這個(gè)問(wèn)題么如果要求只能輸入數(shù)字怎么做設(shè)置那我如果想限制長(zhǎng)度,此時(shí)會(huì)失效,限制長(zhǎng)度太麻煩了并且還存在的一個(gè)問(wèn)題是,當(dāng)輸入的是小數(shù)時(shí),鼠標(biāo)懸停在上會(huì)提示請(qǐng)輸入有效值,兩個(gè)最接近的值為和,這對(duì) 我來(lái)打自己臉了!!!!...剛剛發(fā)現(xiàn)在中文輸入法下是無(wú)效的,有人能解決這個(gè)問(wèn)題么 如果要求input只能輸入數(shù)字怎么做? 設(shè)置type=numbe...

    el09xccxy 評(píng)論0 收藏0
  • Vue中結(jié)合ElementUI實(shí)現(xiàn):限制輸入只能輸入正整數(shù)

    摘要:中結(jié)合實(shí)現(xiàn)限制輸入框只能輸入正整數(shù)如果覺(jué)得對(duì)您有所幫助,麻煩您動(dòng)動(dòng)您的小手指給點(diǎn)個(gè)贊唄中禁止輸入小數(shù)和負(fù)數(shù)只允許輸入正整數(shù)做法一利用禁止按鍵的方法,主要是依靠禁止按下減號(hào)以及小數(shù)點(diǎn)來(lái)完成的首先要監(jiān)聽(tīng)鍵盤(pán)按下事件,因?yàn)樯厦娴慕M件監(jiān)聽(tīng)事件是沒(méi)有 Vue中結(jié)合ElementUI實(shí)現(xiàn):限制輸入框只能輸入正整數(shù) 如果覺(jué)得對(duì)您有所幫助,麻煩您動(dòng)動(dòng)您的小手指給點(diǎn)個(gè)贊唄(*^▽^*) input中禁止...

    iamyoung001 評(píng)論0 收藏0
  • 基于PHP/CURL/codeIgniter的Spider Webbot爬蟲(chóng)[7]常用正則表達(dá)式

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

    wow_worktile 評(píng)論0 收藏0
  • element el-input directive數(shù)字

    摘要:使用自定義指令格式化背景使用開(kāi)發(fā)的過(guò)程中遇到循環(huán)的數(shù)據(jù)只能輸入數(shù)字,并且有不要小數(shù)點(diǎn),有需要小數(shù)點(diǎn)的使用進(jìn)行控制開(kāi)發(fā)頁(yè)面使用方式為保留幾位小數(shù)因?yàn)橛玫氖堑模M件外層包著一層所以要使用獲取對(duì)其監(jiān)聽(tīng)失 使用自定義指令格式化el-input 背景 使用element開(kāi)發(fā)的過(guò)程中遇到循環(huán)的數(shù)據(jù)只能輸入數(shù)字,并且有不要小數(shù)點(diǎn),有需要小數(shù)點(diǎn)的使用vue directive 進(jìn)行控制showImg(...

    nifhlheimr 評(píng)論0 收藏0
  • 數(shù)字在JavaScript中是如何編譯的

    摘要:數(shù)字?jǐn)?shù)字都是浮點(diǎn)數(shù),按照標(biāo)準(zhǔn)進(jìn)行存儲(chǔ)。因此,只有偶數(shù)可以在范圍內(nèi)表示。但只有超過(guò)指數(shù)的上限才稱(chēng)為中的溢出。結(jié)論在這篇博文中,我們研究了如何將其浮點(diǎn)數(shù)轉(zhuǎn)換為位。 JavaScript中的所有數(shù)字都是浮點(diǎn)數(shù)。這篇博客文章解釋了這些浮點(diǎn)數(shù)如何在64位二進(jìn)制內(nèi)部表示。由于特別考慮,本文中的數(shù)字將用整數(shù)表示,以便在閱讀本文后,您將了解在以下交互中會(huì)發(fā)生什么: (譯者注:浮點(diǎn)數(shù)并不一定等于小數(shù),定...

    Moxmi 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<