添加多个行程, 无论在哪个行程上修改时间, 时间总是只显示在最后一个行程里
错误代码:
<div class="journey"><divv-for="(item, index) in ruleform.hrms_business_item":key="index"><div class="journey-title"><span>{{ "行程" + (index + 1) }}</span><van-iconname="delete-o"size="18"color="#323233"@click="deltrip($event, index)" /></div><van-cell-group inset class="cell journey-toptime"><van-fieldclass="dispensable"v-model="item.startDate"label="开始时间"placeholder="请选择"label-align="top"is-linkname="picker"@click="pickerData.showPickerstartDate = true" /><!--主要问题就是 pickerData.showPickerstartDate 控制了组件是否弹出--><timepicker:values="item.startDate"@changeValue="pickerData.showPickerstartDate = false":showPicker="pickerData.showPickerstartDate"@click="onConClick($event, 'startDate', index)"@confirm="onConfirmHHMMSS($event, 'startDate', index)"@cancelOn="pickerData.showPickerstartDate = false" /><van-fieldclass="dispensable"v-model="item.endDate"label="结束时间"placeholder="请选择"label-align="top"is-linkname="picker"@click="pickerData.showPickerendDate = true" /><timepicker:values="item.endDate"@changeValue="pickerData.showPickerendDate = false":showPicker="pickerData.showPickerendDate"@confirm="onConfirmHHMMSS($event, 'endDate', index)"@cancelOn="pickerData.showPickerendDate = false" /><van-fieldclass="dispensable"v-model="item.note"label="备注"placeholder="请输入"label-align="top"type="textarea":autosize="{ maxHeight: 30 }" /></van-cell-group></div><div class="journey-plus" @click="addtrip"><van-icon name="plus" color="#4B6EF6" /><span>添加行程</span></div></div>
主要问题就是 pickerData.showPickerstartDate 控制了组件是否弹出, 讲道理在for循环当中, 利用外部字段控制弹窗是否弹出, 并传递对应下标, 应该是可以正常传递的, 但是这里不行, 必须用item.showPickerstartDate控制弹窗是否打卡关闭.
正确代码:
<div class="journey"><divv-for="(item, index) in ruleform.hrms_business_item":key="index"><div class="journey-title"><span>{{ "行程" + (index + 1) }}</span><van-iconname="delete-o"size="18"color="#323233"@click="deltrip($event, index)" /></div><van-cell-group inset class="cell journey-toptime"><van-fieldclass="dispensable"v-model="item.startDate"label="开始时间"placeholder="请选择"label-align="top"is-linkname="picker"@click="item.showPickerstartDate = true" /><timepicker:values="item.startDate"@changeValue="item.showPickerstartDate = false":showPicker="item.showPickerstartDate"@click="onConClick($event, 'startDate', index)"@confirm="onConfirmHHMMSS($event, 'startDate', index)"@cancelOn="item.showPickerstartDate = false" /><van-fieldclass="dispensable"v-model="item.endDate"label="结束时间"placeholder="请选择"label-align="top"is-linkname="picker"@click="item.showPickerendDate = true" /><timepicker:values="item.endDate"@changeValue="item.showPickerendDate = false":showPicker="item.showPickerendDate"@confirm="onConfirmHHMMSS($event, 'endDate', index)"@cancelOn="item.showPickerendDate = false" /><van-fieldclass="dispensable"v-model="item.note"label="备注"placeholder="请输入"label-align="top"type="textarea":autosize="{ maxHeight: 30 }" /></van-cell-group></div><div class="journey-plus" @click="addtrip"><van-icon name="plus" color="#4B6EF6" /><span>添加行程</span></div></div>
修改后即可正常回显数据