01-ElementUI_日期选择器默认展示当前月份在右边
element
A Vue.js 2.0 UI Toolkit for Web
项目地址:https://gitcode.com/gh_mirrors/eleme/element
·
应用场景: 当前日期的查询所有数据皆为过往数据(历史数据), 时间在当下往前
默认: 当前月份展示在左边.
实现: 点击选择时自动点击下个月按钮
<!-- html -->
<span @click="changeInitCalendarRange">
<el-date-picker v-model="dateRange" type="datetimerange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="onsetmonitor" :default-time="['00:00:00', '23:59:59']" :clearable="false">
</el-date-picker>
</span>
// js
// 定义countss
data() {
return {
dateRange:[],
countss: 0,
}
},
methods: {
changeInitCalendarRange() {
if (this.countss > 0) return;
this.countss++;
let element = document.querySelector("button.el-picker-panel__icon-btn.el-icon-arrow-left");
if (element) element.click(); // 点击一次下个月
},
//如果选定值,重置countss
onsetmonitor() {
if (this.dateRange) return;
this.countss = 0; // 当日期数据为[]时重置
}
}

另外, ElementPlus也适用, 但是要修改一下获取元素的类名: .arrow-left
let element = document.querySelector("button.el-picker-panel__icon-btn.arrow-left");
结束.
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:4 个月前 )
c345bb45
1 年前
a07f3a59
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update table.md
* Update transition.md
* Update popover.md 1 年前
AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。
更多推荐


所有评论(0)