網站首頁 編程語言 正文
一般情況下,我們需要給后臺的時間格式是:
“yyyy-MM-dd”
但是使用Element ui日期選擇器DatePicker
獲取的值是這樣的:
Thu Nov 04 2021 00:00:00 GMT+0800 (中國標準時間)
在官方文檔中,有提到可以使用value-format
日期格式我們采用"yyyy-MM-dd"
,此時,我們只需在時間選擇器上加value-format="yyyy-MM-dd"
的屬性就可以了
若使用的是選擇日期范圍
型的DatePicker
,返回的時間值為一個數組:
可以通過它的修改事件@change="dateChange"
進行數據包裝,也可以通過數組形式直接使用。
輸出time_start
和time_end
// 選擇器組件
<el-pagination
:current-page="currentPage"
:page-sizes="[5, 10, 20, 50]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalAmount"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
export default {
data() {
return {
form: {
time_start: '', // 查詢開始日期,非必填
time_end: '' // 查詢結束日期,非必填
},
dateVal: '', // 選擇日期范圍型的時間選擇器的值
pickerOptions: {
// 設置日期快捷查詢
shortcuts: [
{
text: '最近一周',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
picker.$emit('pick', [start, end])
}
},
{
text: '最近一個月',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
picker.$emit('pick', [start, end])
}
},
{
text: '最近三個月',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
picker.$emit('pick', [start, end])
}
}
]
}
}
methods: {
// 改變時間日期
dateChange(val) {
// console.log(val)
this.form.time_start = val[0]
this.form.time_end = val[1]
}
}
}
}
原文鏈接:https://blog.csdn.net/vvv3171071/article/details/121500453
- 上一篇:沒有了
- 下一篇:沒有了
相關推薦
- 2022-08-13 Spring中@Bean注解的作用以及如何使用
- 2022-06-19 Go獲取兩個時間點時間差的具體實現_Golang
- 2023-02-01 Flutter?彈性布局基石flex算法flexible示例詳解_Android
- 2023-03-05 Go語言學習之golang-jwt/jwt的教程分享_Golang
- 2023-04-02 使用Pytorch如何完成多分類問題_python
- 2021-12-05 C++11?關鍵字?const?使用小結_C 語言
- 2022-11-29 ASP.NET?MVC把數據庫中枚舉項的數字轉換成文字_基礎應用
- 2024-03-17 為解決Win11子系統的Ubuntu被刪除后,重新安裝出現找不到系統路徑問題,無法正常安裝
- 欄目分類
-
- 最近更新
-
- window11 系統安裝 yarn
- 超詳細win安裝深度學習環境2025年最新版(
- Linux 中運行的top命令 怎么退出?
- MySQL 中decimal 的用法? 存儲小
- get 、set 、toString 方法的使
- @Resource和 @Autowired注解
- Java基礎操作-- 運算符,流程控制 Flo
- 1. Int 和Integer 的區別,Jav
- spring @retryable不生效的一種
- Spring Security之認證信息的處理
- Spring Security之認證過濾器
- Spring Security概述快速入門
- Spring Security之配置體系
- 【SpringBoot】SpringCache
- Spring Security之基于方法配置權
- redisson分布式鎖中waittime的設
- maven:解決release錯誤:Artif
- restTemplate使用總結
- Spring Security之安全異常處理
- MybatisPlus優雅實現加密?
- Spring ioc容器與Bean的生命周期。
- 【探索SpringCloud】服務發現-Nac
- Spring Security之基于HttpR
- Redis 底層數據結構-簡單動態字符串(SD
- arthas操作spring被代理目標對象命令
- Spring中的單例模式應用詳解
- 聊聊消息隊列,發送消息的4種方式
- bootspring第三方資源配置管理
- GIT同步修改后的遠程分支