问题描述:el-date-picker原本用的是monthrange月区间选项,后来想改成年区间,el官网没有这个组件,下面是结合百度搜索+实际情况,已经过测试给出的结果!
1、引入组件
<el-date-picker v-model="value" type="yearrange" align="right" unlink-panels range-separator="至" :format="yyyy" :value-format="yyyy" :start-placeholder="beginDate" :end-placeholder="endDate" ></el-date-picker> //type="yearrange"这是重点
2、下载2文件替换js文件
找到node_moduleselement-uilibdate-picker.js替换掉 找到node_moduleselement-uilibelement-ui.common.js替换掉
3、在element-ui/index.css新增以下样式
.el-year-table td {
padding: 8px 0;
}
.el-year-table td div {
height: 48px;
padding: 6px 0;
box-sizing: border-box;
}
.el-year-table td div .cell {
height: 36px;
line-height: 36px;
border-radius: 18px;
}
.el-year-table td.start-date div {
border-top-left-radius: 24px;
border-bottom-left-radius: 24px;
}
.el-year-table td.end-date div {
border-top-right-radius: 24px;
border-bottom-right-radius: 24px;
}
.el-year-table td.in-range div {
background-color: #f2f6fc;
}
.el-year-table td.start-date .cell,
.el-year-table td.end-date .cell {
color: #fff;
background-color: #409eff;
}
.el-year-table td.today.start-date .cell,
.el-year-table td.today.end-date .cell {
color: #fff;
}
上面是“修改element-ui源码兼容el-date-picker支持年区间选择”的全面内容,想了解更多关于 vuejs 内容,请继续关注web建站教程。
当前网址:https://ipkd.cn/webs_2327.html
workflows工作流
图生图工作流:藏族姑娘ComfyUI工作流
瀑布边坐着一位披着斗篷的隐士
一位漂亮的女人坐在樱花树旁
树上挂着一只快乐的荔枝ComfyUI工作流
一架令人难忘的美丽钢琴ComfyUI工作流
一个女人站在海边的岩石上,飞来一只鸟
哈利波特魔法ComfyUI工作流
一棵树从鸟笼里长出来的梦幻般场景
猜你喜欢
声明:本站提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请发送到邮箱:admin@ipkd.cn,我们会在看到邮件的第一时间内为您处理!

在线生成金属文字
canvas黑洞漩涡(canvas+js)
css3实现星球旋转
css3画弹珠,可以滚动!
自动打字效果(惊喜在后面)
用svg画出游泳池动画效果
做一个好玩的时钟翻牌效果
HTML5 Canvas 刻度尺











