wxml:
html
<view class="container">
<picker style="margin-left: 20rpx;" class="picker" bindchange="bindAccountChangeCL" range-key="plateNumber" value="{{plateIndexC}}" range="{{plateindEX}}">
<view style="float: left;line-height: 75rpx;{{plateIndexC == 0?'color:#ccc;':''}}" class="weui-input">
{{plateindEX[plateIndexC].plateNumber}}
</view>
</picker>
</view>
js:
javascript
Page({
data: {
res: {
data: [
{
createTime: 96,
departureArriveTime: 85,
destinationArriveTime: 45,
driverId: "1928249333765070850",
driverName: "索东成",
plateNumber: "吉AX6019",
vehicleId: "1336953190430212097"
},
{
createTime: 96,
departureArriveTime: 85,
destinationArriveTime: 45,
driverId: "1928249333765070850",
driverName: "索东成",
plateNumber: "吉AX6019",
vehicleId: "1336953190430212097"
},
{
createTime: 96,
departureArriveTime: 85,
destinationArriveTime: 45,
driverId: "1928249333765070850",
driverName: "索东成",
plateNumber: "吉AX6019",
vehicleId: "1336953190430212097"
},
{
createTime: 96,
departureArriveTime: 85,
destinationArriveTime: 45,
driverId: "1928249333765070850",
driverName: "索东成",
plateNumber: "吉AX6019",
vehicleId: "1336953190430212097"
}
]
},
plateindEX: [],
plateIndexC: 0
},
onLoad: function() {
this.initVehicleList();
},
initVehicleList: function() {
// 从res.data中提取车辆数据并映射id
const vehicleData = this.data.res.data.map(item => ({
id: item.vehicleId,
plateNumber: item.plateNumber
}));
let vehicleList = [{ id: "0", plateNumber: "选择车辆" }];
if (vehicleData && vehicleData.length > 0) {
vehicleList = [...vehicleList, ...vehicleData];
}
// 更新数据到页面
this.setData({
plateindEX: vehicleList,
plateIndexC: 0
});
},
bindAccountChangeCL: function(e) {
console.log('车辆picker发送选择改变,携带值为', e.detail.value);
this.setData({
plateIndexC: e.detail.value
})
// 获取选中的车辆ID
const selectedId = this.data.plateindEX[e.detail.value].id;
if(selectedId !== "0") {
// 执行选中车辆后的逻辑
console.log('选中的车辆ID:', selectedId);
}
}
})