美文网首页
el-date-picker type=daterange日期回

el-date-picker type=daterange日期回

作者: 王思雨_19强化班 | 来源:发表于2022-02-06 19:14 被阅读0次

回显时,el-date-picker 所绑定的 v-model 的值已经改变,但是控件中没有实时更新 

在@input中采用 this.$set 方法进行数据的更新

<el-date-picker

    v-model="baseForm.liveTime"

    type="daterange"

    range-separator="-"

    start-placeholder="开始时间"

    end-placeholder="结束时间"

    @input="timeDetailClick">

</el-date-picker>

data(){

    return {

        baseForm: {

            liveTime: [],

        },

    }

}

methods: {

    // datarange回显

    timeDetailClick(e){

        this.$nextTick(() => {

            this.baseForm.liveTime = ['',''];

            this.$set(this.baseForm, "liveTime", [e[0], e[1]]);

        });

    },

   

    // 在接口回显方法中

    detail(){

        preachInfo.detailAirTalk(this.id).then(res=>{

            if(res.code == 0){

                this.$set(this.baseForm, "liveTime", [

                    moment.unix(res.data.startTime/1000).format("YYYY-MM-DD"),

                    moment.unix(res.data.endTime/1000).format("YYYY-MM-DD")

                ]);

            }

        })

    }

}

相关文章