vue車牌號校驗和銀行校驗實戰(zhàn)
更新時間：2019年01月23日 09:15:48 作者：緋色璃
這篇文章主要介紹了vue車牌號校驗和銀行校驗實戰(zhàn)，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
在看這篇文章之前，我建議大伙可以去把項目demo拉到本地看看。如果覺得寫得不好，可以一起提提issues，一起維護。或者大伙有剛需，可以留言，后期會不斷完善。
使用方法：
git clone https://github.com/13725102796/css3-demo.git cd css3-demo npm i (yarn install) npm start
瀏覽器打開localhost: 8080 即可訪問
先談談車牌號的校驗。之前折騰了好久，網上文章也比較雜亂。后來無意中發(fā)現了一個比較好用的庫 ——plate-number-input
就直接用來改造了。具體效果如下：
用法如下：
npm i plate-number-input
import PlateNumberInput from 'plate-number-input'
const input = new PlateNumberInput({
el: "#plateNumapp",
defaultNumber: '默認號碼',
isNewpower: false,
//
onBtnSaveClick: ()=>{
// 點擊保存回調事件，input.getNumber()代表獲取當前輸入的號碼
console.log(input.getNumber())
}
});
下個案例 —— 銀行卡校驗
（注： 銀行卡校驗只能通過個人卡號的校驗，企業(yè)卡號是無法校驗，因為調用是支付寶校驗的接口，企業(yè)只能做到校驗號碼位數）
具體效果如下：
npm i bankcardinfo
import BIN from "bankcardinfo";
BIN.getBankBin(this.form.bank_account)
.then(data => {
console.log(data);
if(data.bankName){
console.log(data.bankName + data.cardTypeName)
}
})
.catch(err => {
let errMsg = (err.split(':')[1]).split(',')[0]
console.log(errMsg )
});
具體業(yè)務邏輯還是要靠自己去寫。企業(yè)銀行要自行補充該卡的銀行名稱，獲取不了。
demo里面還有一個很唯美的輪播，如果能幫上大家的忙，別忘了給個star！??！
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
您可能感興趣的文章:
相關文章
這篇文章主要給大家介紹了關于Vue路由跳轉傳參或打開新頁面跳轉的相關資料,在使用Vue.js開發(fā)單頁面應用時常常會遇到路由跳轉傳參的需求,需要的朋友可以參考下2023-07-07
這篇文章主要為大家介紹了vue與ant-tree結合偽造懶加載并可以查詢實現示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-07-07
徑向條形圖是一種用于可視化單一數據點及其與目標或理想值的關系的圖表類型,它在顯示進度、完成率或其他類似度量時非常有用,本文給大家介紹了使用Vue3和ApexCharts實現3D徑向條形圖,感興趣的小伙伴可以參考閱讀下2024-06-06
@font-face?是?CSS?中的一個規(guī)則,它允許你加載服務器上的字體文件（遠程或者本地）,并在網頁中使用這些字體,本文給大家介紹了Vue使用font-face自定義字體的案例,并通過代碼講解的非常詳細,需要的朋友可以參考下2024-03-03
在企業(yè)開發(fā)過程中,往往有著明確的前后端的分工,前端負責接收、使用接口,后端負責編寫、處理接口,下面這篇文章主要給大家介紹了關于vue3項目實戰(zhàn)中的接口調用的相關資料,需要的朋友可以參考下2022-12-12
vue3+element-plus?Dialog對話框的使用與setup?寫法的用法
這篇文章主要介紹了vue3+element-plus?Dialog對話框的使用?與?setup?寫法的使用,本文通過兩種方式結合實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2023-04-04
最近學習threejs有些時間了,就想著著手做些東西,下面這篇文章主要給大家介紹了關于vue3中如何用threejs畫一些簡單的幾何體的相關資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-03-03
解決Vue的文本編輯器 vue-quill-editor 小圖標樣式排布錯亂問題
這篇文章主要介紹了解決Vue的文本編輯器 vue-quill-editor 小圖標樣式排布錯亂問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08
這篇文章主要介紹了淺談Vue初學之props的駝峰命名，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-07-07
本文主要介紹了vue+vite項目部署會遇到的幾個問題，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2023-04-04