<view class='che'><view bindtap='go'>請輸入要辦理ETC車輛的的車牌號</view><view class='fle'><block wx:for="{{cars}}"><view class='itemsss {{count==index?"active":""}} {{item=="新能源"?"xin":""}}'>{{item}}</view><view wx:if="{{index==1}}" class='dian'>.</view></block></view><view class='car'><!-- <view bindtap='showCity' class='carNo {{carNo==""?"":"hei"}}'>{{carNo||'請輸入車牌號碼'}}</view> --><view hidden="{{isCarNo}}" class='city'><view class='item {{index>23?"w":""}}' wx:for="{{cityArr}}" bindtap='chooseCity' data-item="{{item}}">{{item}}</view></view><view hidden='{{isZimu}}' class='zimu'><block wx:for="{{zimu}}"><view class='item {{count==0&&index<10?"jinzhi":""}}' data-index="{{index}}" bindtap='chooseZimu' data-item="{{item}}"><text data-index="{{index}}" data-item="{{item}}"> {{item}}</text></view><view class='del' bindtap='clear' wx:if="{{index==27}}"><image src='http://etc-app.oss-cn-beijing.aliyuncs.com/image_201907221155210160.png' mode='widthFix'></image></view></block><view class='close' bindtap='close'><text>確認辦理</text></view></view></view></view> /* pages/che/che.wxss */view {box-sizing: border-box; }.fle {display: flex;margin-bottom: 20rpx; }.itemsss {width: 60rpx;height: 70rpx;border: 1rpx solid #ccc;margin-left: 10rpx;text-align: center;line-height: 70rpx; }.active {border: 1rpx solid #15bf5d; }.dian {margin: 0 15rpx;height: 70rpx;line-height: 50rpx; } .xin {font-size: 18rpx;color: #15bf5d;border: 1rpx dashed #ccc; }/* */.car {width: 750rpx;padding: 22rpx 13rpx;box-sizing: border-box;background: #ebebeb; } .item {background: white;box-shadow: 0px 5rpx 10rpx 0px #d1d1d1;border: 1rpx solid #d0d0d0;/* margin: 10rpx; */border-radius: 9rpx;font-size: 24rpx;box-sizing: border-box;display: flex;align-items: center;justify-content: center; }.city,.zimu {display: flex;flex-wrap: wrap;justify-content: space-between; } .city .item {width: 79rpx;height: 104rpx;margin: 6rpx;line-height: 99rpx; } .w {width: 90rpx !important; } .zimu .item {width: 62rpx;height: 104rpx;margin: 5.5rpx;}.close {margin: 5.5rpx;width: 278rpx;height: 104rpx;font-size: 24rpx;line-height: 70rpx;background: #15bf5d;box-shadow: 0px 5rpx 10rpx 0px #d1d1d1;border: 1rpx solid #d0d0d0;border-radius: 9rpx;box-sizing: border-box;text-align: center;display: flex;justify-content: center;align-items: center; } .del {width: 135rpx;height: 104rpx;background-color: white;margin: 5.5rpx;border: 1rpx solid #d0d0d0;box-shadow: 0px 5rpx 10rpx 0px #d1d1d1;border-radius: 9rpx;/* text-align: center; */display: flex;justify-content: center;align-items: center; } .del image {width: 70rpx;height: 46rpx !important; } .jinzhi {background-color: #e5e5e5; } // pages/che/che.js var carNo_reg = /^(([京津滬渝冀豫云遼黑湘皖魯新蘇浙贛鄂桂甘晉蒙陜吉閩貴粵青藏川寧瓊使領][A-Z](([0-9]{5}[DF])|([DF]([A-HJ-NP-Z0-9])[0-9]{4})))|([京津滬渝冀豫云遼黑湘皖魯新蘇浙贛鄂桂甘晉蒙陜吉閩貴粵青藏川寧瓊使領][A-Z][A-HJ-NP-Z0-9]{4}[A-HJ-NP-Z0-9掛學警港澳使領]))$/ // let count = 0 Page({/*** 頁面的初始數據*/data: {cars: ['', '', '', '', '', '', '', '新能源'],count: 0,// chepaicarNo: '',cityArr: ['京','滬','浙','蘇','粵','魯','晉','冀','豫','川','渝','遼','吉','黑','皖','鄂','津','貴','云','桂','瓊','青','新','藏','蒙','寧','甘','陜','閩','贛','湘'],zimu: ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9","Q", "W", "E", "R", "T", "Y", "U", "P","A", "S", "D", "F", "G", "H", "J", "K", "L","Z", "X", "C", "V", "B", "N", "M"],isCarNo: false,isZimu: true,carsData:''},/*** 組件的方法列表*/go() {console.log('s')wx.navigateTo({url: '/pages/index/index'})},showCity() {// 如果空 則顯示 城市 否 則顯示 字母if (this.data.carNo) {this.setData({isZimu: false,isCarNo: true})} else {this.setData({isCarNo: false,isZimu: true})}},chooseCity(e) {this.data.cars[this.data.count] = e.target.dataset.itemthis.setData({carNo: e.target.dataset.item,isCarNo: true,isZimu: false,cars: this.data.cars,count: this.data.count})},chooseZimu(e) {console.log(this.data.count)if (this.data.count == 0) {console.log(e.target.dataset.index)if (e.target.dataset.index <= 9) {return}}this.setData({count: this.data.count + 1})if (this.data.count > 7) return this.setData({count: 7})this.data.cars[this.data.count] = e.target.dataset.item// let newCarNo = this.data.carNo + e.target.dataset.itemthis.setData({// carNo: newCarNo,cars: this.data.cars,count: this.data.count})},close() {// this.setData({// isCarNo: true,// isZimu: true// })// 驗證的if (this.data.cars[this.data.cars.length - 1] == '新能源') { //新能源就把最后一個刪了 this.data.cars = this.data.cars.slice(0, 7)this.setData({carsData: this.data.cars // 賦值給新數組 保證返回得時候新能源還在 外部直接調取使用})console.log(this.data.carsData)} else {this.setData({carsData: this.data.cars})}if (carNo_reg.test(this.data.cars.join(''))) {console.log(this.data.cars)this.triggerEvent('getOk')} else {wx.showToast({title: '請輸入正確格式的車牌號',icon: 'none'})}},clear() {console.log(this.data.count)if (this.data.count > 7) {this.setData({count: 7})}this.data.cars[this.data.count] = ''this.data.cars[7] = '新能源'// 從尾部刪除一個this.setData({// carNo: this.data.carNo.substr(0, this.data.carNo.length - 1),cars: this.data.cars,count: this.data.count - 1})if (this.data.count < 0) this.setData({isCarNo: false,isZimu: true,count: 0})}})

拿到車牌字符串形式：che為引入的組件名
plateNum: che.data.carsData.join(’’)

總結

以上是生活随笔為你收集整理的微信小程序新能源 车牌号的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。