zoukankan      html  css  js  c++  java
  • iview DatePicker daterange data month UTC格式化问题

    第一种格式化:使用后端处理UTC 格式:

    1.html元素定义:

    <DatePicker v-model="searchCreateTime" type="daterange" placement="bottom-end" placeholder="选择创建时间区间"  clearable ></DatePicker>

    2.vue js 定义:

    searchCreateTime:['', ''],

    3.获取值:

    createTimeStart: this.createTime[0],  

    createTimeEnd: this.createTime[1],

    4.后端接受处理

    {"page":1,"limit":10,"status":"","wxcode":"","type":"","orderCode":"","userName":"","createTimeStart":"2020-06-07T16:00:00.000Z","createTimeEnd":"2020-06-10T16:00:00.000Z"}
    
    SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'");
    df.setTimeZone(TimeZone.getTimeZone("UTC"));
    SimpleDateFormat dfMy = new SimpleDateFormat("yyyy-MM-dd");
    String createTimeStart
    = StringISNULLUtil.mapToString(searchPreamMy.get("createTimeStart")); String createTimeEnd = StringISNULLUtil.mapToString(searchPreamMy.get("createTimeEnd"));
    if (createTimeEnd != null && !"".equals(createTimeEnd)) { map.put("createTimeEnd", dfMy.format(df.parse(createTimeEnd))+" 23:59:59"); } else { map.put("createTimeEnd", ""); } if (createTimeStart != null && !"".equals(createTimeStart)) { map.put("createTimeStart", dfMy.format(df.parse(createTimeStart))+" 00:00:00"); } else { map.put("createTimeStart", ""); }

    第二种方式: 前端格式化:

    1.html元素定义: 直接使用format 是不行的, 必须使用on-change赋值才行

    <DatePicker v-model="auditTime" @on-change="setOption" type="daterange" format="yyyy-MM-dd" placement="bottom-end" placeholder="选择注册开始时间以及结束时间" ></DatePicker>

    2.js vue 定义:

    auditTime:['',''],

    3.on-change 设置:

    setOption(date) {

      this.auditTime = date;

    },

    4.取值:

    createTimeStart:this.auditTime[0],

    createTimeEnd:this.auditTime[1],

    5.后端不需要任何处理,直接接受参数即可

    userSearch.setCreateTimeEnd(StringISNULLUtil.mapToString(searchPreamMy.get("createTimeEnd")));
    userSearch.setCreateTimeStart(StringISNULLUtil.mapToString(searchPreamMy.get("createTimeStart")));
  • 相关阅读:
    Tensorflow Tutorial 2: image classifier using convolutional neural network Part-1(译)
    TensorFlow Tutorial: Practical TensorFlow lesson for quick learners
    TensorFlow Tutorial: Practical TensorFlow lesson for quick learners
    Builder Pattern(译)
    Mysql锁机制
    Monitorenter
    非静态内部类
    ConcurrentModificationException
    Http2.0协议
    Docker化 springboot项目
  • 原文地址:https://www.cnblogs.com/yysbolg/p/13144063.html
Copyright © 2011-2022 走看看