在开发过程中遇到一个根据选择的选项做一次接口调用,然后接口调用后的两个日期赋值在el-date-picker控件上,正常情况就是
//订单选择
handleOrderChange(val){
// 如果订单ID不是数字类型,说明是手动输入的,清空日期
if(typeof val !== 'number'){
console.log('handleOrderChange wewqeqwe')
this.form.launchDate = null
this.form.boardingPlatformDate = null
return
}
console.log('handleOrderChange this.form123', this.form)
// 根据订单ID获取订单详情
orderDes(val).then(response => {
const orderInfo = response.data.orderInfo
if(orderInfo.launchDate !== null){
this.form.launchDate = orderInfo.launchDate
}else{
this.form.launchDate = null
}
if(orderInfo.boardingPlatformDate !== null){
this.form.boardingPlatformDate = orderInfo.boardingPlatformDate
}else{
this.form.boardingPlatformDate = null
}
console.log('handleOrderChange this.form456', this.form)
})
},
但是控件一直展示不出来,切换别的选项才会展示出来,于是增加this.set的赋值方法才得以解决,故此记录一下
//订单选择
handleOrderChange(val){
// 如果订单ID不是数字类型,说明是手动输入的,清空日期
if(typeof val !== 'number'){
console.log('handleOrderChange wewqeqwe')
this.$set(this.form, 'launchDate', null)
this.$set(this.form, 'boardingPlatformDate', null)
return
}
console.log('handleOrderChange this.form123', this.form)
// 根据订单ID获取订单详情
orderDes(val).then(response => {
const orderInfo = response.data.orderInfo
if(orderInfo.launchDate !== null){
this.$set(this.form, 'launchDate', orderInfo.launchDate)
}else{
this.$set(this.form, 'launchDate', null)
}
if(orderInfo.boardingPlatformDate !== null){
this.$set(this.form, 'boardingPlatformDate', orderInfo.boardingPlatformDate)
}else{
this.$set(this.form, 'boardingPlatformDate', null)
}
console.log('handleOrderChange this.form456', this.form)
})
},