赞
踩
element ui 选择时间组件: 需求:实现默认时间定位于当前时间延后7天的日期;且当前时间之前的日期不能选;
html部分:
- <el-date-picker
- v-model="shopForm.end_time"
- type="datetime"
- size="medium"
- style="width:100%"
- placeholder="选择日期时间"
- :picker-options="expireTimeOption"
- value-format="timestamp"
- default-time="00:00:00"
- />
js 部分代码实现:
- data() {
- return {
- shopForm: {
- end_time: ''
- },
- expireTimeOption: {
- disabledDate(date) {
- return date.getTime() <= Date.now() - 8.64e7 // new Date()
- }
- }
- }
- },
- created() {
- this.setTime() // 设置默认时间
- },
- methods: {
- // 默认时间设置 7天后
- setTime() {
- const nowD = new Date()
- nowD.setTime(nowD.getTime() + 7 * 3600 * 1000 * 24)
- this.shopForm.end_time = nowD
- },
- /**
- * 选择时间
- */
- changeendTime() {
- if (this.shopForm.end_time > (Date.now())) {
- this.shopForm.end_time = this.shopForm.end_time
- } else {
- this.shopForm.end_time = ''
- this.$message.error('请选择大于当前日期')
- }
- },
- }
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。