前端:vue+elementUI,後端:strapihtml
前端使用的是,elementUI的時間選擇框前端
<el-date-picker v-model="selectDate" type="daterange" range-separator="至" start-placeholder="開始日期" end-placeholder="結束日期" @change="handleDateFilter" style="margin-right:10px"> </el-date-picker>
其中,selectDate :[ ]
控制檯打印輸出的爲中國標準時間,後臺須要的是UTC格式
js代碼:vue
start = new Date(n[0]).toISOString() end = new Date(n[1]).toISOString()
轉換結果:
後端
"Thu Jul 01 2021 00:00:00 GMT+0800 (中國標準時間)" "2021-06-30T16:00:00.000Z"
dataTransform(time){ var date = new Date(time), year = date.getFullYear(), month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1, day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate(), hour = date.getHours() < 10 ? '0' + date.getHours() : date.getHours(), minute = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes(), second = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds(); return year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second; }
另外:
elementUI的時間選擇框支持轉換格式 能夠不用經過js 轉換。value-format="yyyy-MM-dd"
api
<el-date-picker v-model="selectDate" type="daterange" range-separator="至" start-placeholder="開始日期" end-placeholder="結束日期" value-format="yyyy-MM-dd" @change="handleDateFilter" style="margin-right:10px"> </el-date-picker>