<em>Mac</em>Book项目 2009年学校开始实施<em>Mac</em>Book项目,所有师生配备一本<em>Mac</em>Book,并同步更新了校园无线网络。学校每周进行电脑技术更新,每月发送技术支持资料,极大改变了教学及学习方式。因此2011
2021-06-01 09:32:01
HTML:
<el-date-picker v-model="dateValue" type="daterange" size="small" unlink-panels range-separator="至" start-placeholder="開始日期" end-placeholder="結束日期" :shortcuts="shortcuts"> </el-date-picker>
JS:
//放在頁面的state中 shortcuts: [ { text: "本週", value: () => { const end = new Date(); const start = new Date(); //週日算第一天,如果週日查詢本週的話,天數是0,所有如果是0,預設設定為7,處理當前周 const nows = start.getDay() || 7; start.setTime(start.getTime() - 3600 * 1000 * 24 * (nows - 1)); end.setTime(end.getTime() - 3600 * 1000 * 24 * (nows - 7)); console.log(start, end, "end"); return [start, end]; }, }, { text: "本月", value: () => methods.getTime(), }, { text: "上月", value: () => { const oDate = new Date(); let year = oDate.getFullYear(); let month = oDate.getMonth(); let start, end; if (month == 0) { year--; start = new Date(year, 11, 1); end = new Date(year, 11, 31); } else { start = new Date(year, month - 1, 1); end = new Date(year, month, 0); } return [start, end]; }, }, ],
處理本月的函數:
// 獲取本月時間段datePicker使用 getTime() { const oDate = new Date(); let year = oDate.getFullYear(); let month = 0//oDate.getMonth(); let start, end; if (month == 0) { year--; start = new Date(year, 0, 1); end = new Date(year, 12, 31); } else { start = new Date(year, month, 1); end = new Date(year, month + 1, 0); } state.dateValue = [start, end]; return [start, end]; },
需要一進頁面時,把日期選擇器,預設展示為2012-01-01至當前日期-1天
即圖:
2.1
<el-form-item label="時間週期:" prop="timeCycle" > <el-date-picker v-model="createForm.timeCycle" type="datetimerange" :picker-options="pickerOptions" //快捷時間選擇的函數 range-separator="至" start-placeholder="開始日期" end-placeholder="結束日期" value-format="yyyy-MM-dd" //預設值為這種格式 > </el-date-picker> </el-form-item>
2.2
由於開始時間是固定的,所以需要在定義資料時定義好,結束時間不能不填,也不能是" ",也不能是不符合時間格式的,否則整個時間選擇器都不會展示了
data(){ return { createForm: { timeCycle:["2012-01-01","2012-01-01"] } } }
2.3
在頁面一載入時,在created函數裡把結束時間算好,然後賦值到定義的timeCycle陣列的第二項
created(){ const end = new Date();//獲取當前的日期 end.setTime(end.getTime() - 3600 * 1000 * 24 ) //計算,將當期日期-1天 //此時得到的是中國標準時間,格式不是yyyy-MM-dd,需要用dateFormat這個函數轉換下 this.createForm.timeCycle[1]=this.dateFormat(end) //將轉換完的正確格式的結束時間賦值到timeCycle陣列的第二項 }
2.4
時間格式的轉換函數
中國標準時間,即,例如:Wed Oct 24 2018 20:00:00 GMT+0800
轉換為:yyyy-MM-dd格式,即:2018-10-24
methods:{ dateFormat(dateData) { var date = new Date(dateData) var y = date.getFullYear() var m = date.getMonth() + 1 m = m < 10 ? ('0' + m) : m var d = date.getDate() d = d < 10 ? ('0' + d) : d const time = y + '-' + m + '-' + d return time } }
以上為個人經驗,希望能給大家一個參考,也希望大家多多支援it145.com。
相關文章
<em>Mac</em>Book项目 2009年学校开始实施<em>Mac</em>Book项目,所有师生配备一本<em>Mac</em>Book,并同步更新了校园无线网络。学校每周进行电脑技术更新,每月发送技术支持资料,极大改变了教学及学习方式。因此2011
2021-06-01 09:32:01
综合看Anker超能充系列的性价比很高,并且与不仅和iPhone12/苹果<em>Mac</em>Book很配,而且适合多设备充电需求的日常使用或差旅场景,不管是安卓还是Switch同样也能用得上它,希望这次分享能给准备购入充电器的小伙伴们有所
2021-06-01 09:31:42
除了L4WUDU与吴亦凡已经多次共事,成为了明面上的厂牌成员,吴亦凡还曾带领20XXCLUB全队参加2020年的一场音乐节,这也是20XXCLUB首次全员合照,王嗣尧Turbo、陈彦希Regi、<em>Mac</em> Ova Seas、林渝植等人全部出场。然而让
2021-06-01 09:31:34
目前应用IPFS的机构:1 谷歌<em>浏览器</em>支持IPFS分布式协议 2 万维网 (历史档案博物馆)数据库 3 火狐<em>浏览器</em>支持 IPFS分布式协议 4 EOS 等数字货币数据存储 5 美国国会图书馆,历史资料永久保存在 IPFS 6 加
2021-06-01 09:31:24
开拓者的车机是兼容苹果和<em>安卓</em>,虽然我不怎么用,但确实兼顾了我家人的很多需求:副驾的门板还配有解锁开关,有的时候老婆开车,下车的时候偶尔会忘记解锁,我在副驾驶可以自己开门:第二排设计很好,不仅配置了一个很大的
2021-06-01 09:30:48
不仅是<em>安卓</em>手机,苹果手机的降价力度也是前所未有了,iPhone12也“跳水价”了,发布价是6799元,如今已经跌至5308元,降价幅度超过1400元,最新定价确认了。iPhone12是苹果首款5G手机,同时也是全球首款5nm芯片的智能机,它
2021-06-01 09:30:45