微信小程序车牌号组件，车牌号键盘，兼容新能源号牌

舒适区待久了的码农

已于 2022-12-02 14:33:25 修改

阅读量1k

点赞数

分类专栏：前端文章标签：微信小程序小程序

于 2022-12-02 14:32:33 首次发布

本文链接：https://blog.csdn.net/huyanbinweb/article/details/128147322

版权

前端专栏收录该内容

1 篇文章 0 订阅

订阅专栏

话不多说，先看图

使用方法：

一、将组件代码放入项目任意目录

二、在需要使用键盘组件的页面json文件配置引入组件

三、在模板页面wxml调用组件

  <carNumber custom-input-class="carnum-box" custom-item-class="carnum-input"  custom-energy-icon="energy-icon" defaultNum="{{plateNum}}" bind:change="getCarNumChange" />

四、在js页面接收组件输入的车牌号

  getCarNumChange(e) {
    console.log(e.detail)
    this.setData({plateNum : e.detail})
  },

如果需要微调样式，可以通过class进行调整

.carnum-box{background-color: #ffffff;padding: 0rpx;}
.carnum-input{padding: 0 !important;width: 72rpx !important; height: 72rpx !important; background: #F5F5FA; border-radius: 8rpx !important;line-height: 72rpx; margin: 0 4rpx !important;}
.energy-icon{width: 60rpx !important; height: 68rpx !important; line-height: 0 !important; margin:0 8rpx !important;}

下载地址小程序车牌号输入组件车牌号键盘兼容新能源号牌-Javascript文档类资源-CSDN文库