脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript类库 → React → React 车牌键盘

React 实现车牌键盘的示例代码

 更新时间：2019年12月20日 09:06:55   作者：LiuuY  
这篇文章主要介绍了React 实现车牌键盘的示例代码，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧

vehicle-plate-keyboard

React 实现的车牌键盘。

https://github.com/LiuuY/vehicle-plate-keyboard

💡 Features

省份 + 字母/数字 + '港澳学警领'

新能源车牌

自动判断当前位置可输入字符类型

🚗 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

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

相关文章

  • react解析html字符串方法实现

    react解析html字符串方法实现

    在使用reactjs库的时候,会遇到将一段html的字符串,然后要将它插入页面中以html的形式展现,本文主要介绍了react解析html字符串方法实现,感兴趣的可以了解一下
    2023-12-12
  • Create react app修改webapck配置导入文件alias

    Create react app修改webapck配置导入文件alias

    这篇文章主要为大家介绍了Create react app修改webapck配置导入文件alias,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-12-12
  • react实现全局组件确认弹窗

    react实现全局组件确认弹窗

    这篇文章主要为大家详细介绍了react实现全局组件确认弹窗，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2022-08-08
  • React中异步数据更新不及时问题及解决

    React中异步数据更新不及时问题及解决

    这篇文章主要介绍了React中异步数据更新不及时问题及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-03-03
  • React实现表单提交防抖功能的示例代码

    React实现表单提交防抖功能的示例代码

    在 React 应用中,防抖（Debounce）技术可以有效地限制函数在短时间内的频繁调用,下面我们就来看看如何使用Lodash库中的debounce函数实现React表单提交中实现防抖功能吧
    2024-01-01
  • React高级指引之Refs and the DOM使用时机详解

    React高级指引之Refs and the DOM使用时机详解

    在典型的React数据流中，props是父组件与子组件交互的唯一方式。要修改一个子组件，你需要使用新的props来重新渲染它。但是，在某些情况下，你需要在典型数据流之外强制修改子组件
    2023-02-02
  • 使用react的7个避坑案例小结

    使用react的7个避坑案例小结

    React是个很受欢迎的前端框架。今天我们探索下React开发者应该注意的七点，感兴趣的小伙伴们可以参考一下
    2021-05-05
  • 基于visual studio code + react 开发环境搭建过程

    基于visual studio code + react 开发环境搭建过程

    今天通过本文给大家分享基于visual studio code + react 开发环境搭建过程，本文给大家介绍的非常详细，包括react安装问题及安装 Debugger for Chrome的方法，需要的朋友跟随小编一起看看吧
    2021-07-07
  • 简谈创建React Component的几种方式

    简谈创建React Component的几种方式

    这篇文章主要介绍了创建React Component的几种方式，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，,需要的朋友可以参考下
    2019-06-06
  • react中history(push,go,replace)切换路由方法的区别及说明

    react中history(push,go,replace)切换路由方法的区别及说明

    这篇文章主要介绍了react中history(push,go,replace)切换路由方法的区别及说明,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2023-10-10

最新评论