React 實(shí)現(xiàn)車牌鍵盤的示例代碼
vehicle-plate-keyboard
React 實(shí)現(xiàn)的車牌鍵盤。
https://github.com/LiuuY/vehicle-plate-keyboard
💡 Features
省份 + 字母/數(shù)字 + '港澳學(xué)警領(lǐng)'
新能源車牌
自動判斷當(dāng)前位置可輸入字符類型
🚗 Demo
Demo

📷 Screenshots



📦 Installation
yarn add vehicle-plate-keyboard
🔨 Usage
import LicenseKeyboard from 'vehicle-plate-keyboard';
import 'vehicle-plate-keyboard/dist/main.css';
...
<LicenseKeyboard
visible={state.showKeyboard}
onChange={value => setState({ value })}
value={state.value}
done={() => setState({ showKeyboard: false })}
/>
API
| props | type | description |
|---|---|---|
| visiable | boolean | keyboard visible |
| onChange | (value: string) => void | trigger when user tap |
| value | string | controlled value |
| done | () => void | trigger when keyborad dismiss |
| confirmButtonStyle | React.CSSProperties | confirm button style |
| confirmButtonText | string | confirm button text |
| cellTextStyle | React.CSSProperties | keycell style |
| safeArea | boolean | show safearea |
📝 License
MIT License
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
Create?react?app修改webapck配置導(dǎo)入文件alias
這篇文章主要為大家介紹了Create?react?app修改webapck配置導(dǎo)入文件alias,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-12-12
react實(shí)現(xiàn)全局組件確認(rèn)彈窗
這篇文章主要為大家詳細(xì)介紹了react實(shí)現(xiàn)全局組件確認(rèn)彈窗,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2022-08-08
React實(shí)現(xiàn)表單提交防抖功能的示例代碼
在 React 應(yīng)用中,防抖(Debounce)技術(shù)可以有效地限制函數(shù)在短時間內(nèi)的頻繁調(diào)用,下面我們就來看看如何使用Lodash庫中的debounce函數(shù)實(shí)現(xiàn)React表單提交中實(shí)現(xiàn)防抖功能吧2024-01-01
React高級指引之Refs and the DOM使用時機(jī)詳解
在典型的React數(shù)據(jù)流中,props是父組件與子組件交互的唯一方式。要修改一個子組件,你需要使用新的props來重新渲染它。但是,在某些情況下,你需要在典型數(shù)據(jù)流之外強(qiáng)制修改子組件2023-02-02
基于visual studio code + react 開發(fā)環(huán)境搭建過程
今天通過本文給大家分享基于visual studio code + react 開發(fā)環(huán)境搭建過程,本文給大家介紹的非常詳細(xì),包括react安裝問題及安裝 Debugger for Chrome的方法,需要的朋友跟隨小編一起看看吧2021-07-07
簡談創(chuàng)建React Component的幾種方式
這篇文章主要介紹了創(chuàng)建React Component的幾種方式,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,,需要的朋友可以參考下2019-06-06
react中history(push,go,replace)切換路由方法的區(qū)別及說明
這篇文章主要介紹了react中history(push,go,replace)切換路由方法的區(qū)別及說明,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10

