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

資訊專欄INFORMATION COLUMN

JavaScript技巧分享——純數(shù)字（帶小數(shù)點(diǎn)）過濾

k00baa / 1483人閱讀

摘要：比如，用戶能夠同時(shí)輸入兩個(gè)小數(shù)點(diǎn)。本文章以此為大前提展開略淺的技巧。過程解析原始狀態(tài)說到校驗(yàn)，第一個(gè)想到的就是用正則表達(dá)式。以微信小程序?yàn)槔?。獲取干凈的數(shù)據(jù)非空用過都說好最后，嘻嘻

應(yīng)用場景

在編寫輸入金額的輸入組件input時(shí)，雖然能夠設(shè)置type為number，但卻不能夠自動(dòng)檢驗(yàn)用戶輸入的值是否符合金額的格式。比如，用戶能夠同時(shí)輸入兩個(gè)小數(shù)點(diǎn)。本文章以此為大前提展開略淺的技巧。

過程解析 原始狀態(tài)

說到校驗(yàn)，第一個(gè)想到的就是用正則表達(dá)式。以微信小程序?yàn)槔?/p> DOM結(jié)構(gòu) 

...

...
JavaScript邏輯 
...
numChange(e) {
  // 修改單次金額
  const NEXT = e.detail.value;
  let currentValue = this.data.value;
  const NEW_VALUE = this.numCheck(currentValue, NEXT);
  this.setData({
    value: NEW_VALUE || currentValue;
  })
},
numCheck(prev, next) {
  // 數(shù)據(jù)過濾
  // 只保留兩位小數(shù)
  if (next && !/^(([1-9]d*)|0)(.d{0,2}?)?$/.test(next)) {
    if (next === ".") return "0.";
    return prev;
  }
  return next;
}
...
獲取非空數(shù)據(jù)并且轉(zhuǎn)換數(shù)據(jù)類型

因?yàn)榻?jīng)過過濾后，返回的數(shù)據(jù)類型是字符串，在使用時(shí)，需要再轉(zhuǎn)換一下數(shù)據(jù)類型。

...
getPureMoney() {
  // 獲取干凈的數(shù)據(jù)（非空）
  const { value } = this.data;
  const PARSE_VALUE = parseFloat(value);
  return !isNaN(PARSE_VALUE) ? PARSE_VALUE : "";
},
...
用過都說好！

最后，嘻嘻！

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

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

相關(guān)文章

  • JavaScript 技巧收藏

    摘要：對(duì)象通過方法強(qiáng)制轉(zhuǎn)化為數(shù)字，通過方法強(qiáng)制轉(zhuǎn)換為字符串過濾數(shù)組中的所有假植中有一些假值過濾這些假值，可以使用構(gòu)造函數(shù)來進(jìn)行一次轉(zhuǎn)換雙位運(yùn)算符可以使用雙位操作符來代替。雙否定位操作符的優(yōu)勢在于它執(zhí)行相同的操作運(yùn)行速度更快。 JavaScript 小技巧 1.類型轉(zhuǎn)換 string -> number 32 * 1 // 32 abc * 1 // NaN nul...

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

  • 前端實(shí)用資源整理

    摘要：事件的響應(yīng)分區(qū)為三個(gè)階段捕獲目標(biāo)冒泡階段。綁定的多個(gè)事件會(huì)被覆蓋，后者覆蓋前者。再用轉(zhuǎn)換成數(shù)值表示。如實(shí)際數(shù)量為，則展示為項(xiàng)目中使用過濾器做的處理可以抽取方法的，調(diào)整相關(guān)，可以獲取指定位數(shù)的縮寫。 CSS html5中a的download屬性 定義和用法download 屬性定義下載鏈接的地址或指定下載文件的名稱。文件名稱沒有限定值，瀏覽器會(huì)自動(dòng)在文件名稱末尾添加該下載文件的后綴 (...

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

  • 前端實(shí)用資源整理

    摘要：事件的響應(yīng)分區(qū)為三個(gè)階段捕獲目標(biāo)冒泡階段。綁定的多個(gè)事件會(huì)被覆蓋，后者覆蓋前者。再用轉(zhuǎn)換成數(shù)值表示。如實(shí)際數(shù)量為，則展示為項(xiàng)目中使用過濾器做的處理可以抽取方法的，調(diào)整相關(guān)，可以獲取指定位數(shù)的縮寫。 CSS html5中a的download屬性 定義和用法download 屬性定義下載鏈接的地址或指定下載文件的名稱。文件名稱沒有限定值，瀏覽器會(huì)自動(dòng)在文件名稱末尾添加該下載文件的后綴 (...

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

  • 【JS】關(guān)于JS的一些知識(shí)點(diǎn)（JS基礎(chǔ)，純記錄）

    摘要：如何讓根據(jù)拆箱轉(zhuǎn)換，以及的隱式轉(zhuǎn)換，可以如下寫為什么計(jì)算機(jī)中所有的數(shù)據(jù)都是以二進(jìn)制存儲(chǔ)的，所以在計(jì)算機(jī)計(jì)算時(shí)要把數(shù)據(jù)先轉(zhuǎn)換成二進(jìn)制進(jìn)行計(jì)算，然后把計(jì)算結(jié)果轉(zhuǎn)換成十進(jìn)制。會(huì)存在精度丟失問題和的二進(jìn)制都是以無線循環(huán)的小數(shù)的二進(jìn)制的二進(jìn)制 本想著記筆記里，但是筆記里沒有分類，還是以文章的形式，當(dāng)個(gè)人總結(jié)吧，這一篇就當(dāng)作JS基礎(chǔ)篇的記錄吧，有修改的和新增的持續(xù)更新～ 關(guān)于JS的一些小技巧 1:...

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

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

0條評(píng)論

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