el-elementUI使用el-date-picker选择年月
更新时间:2024年02月05日 15:50:09 作者:small面包
本文主要介绍了el-elementUI使用el-date-picker选择年月,文中通过示例代码介绍的非常详细,需要的朋友们下面随着小编来一起学习学习吧
基于时间周期控件实现月周期、年周期的选择

<el-date-picker
v-model="gysForm.year"
type="year"
placeholder="选择日期"
format="yyyy"
value-format="yyyy"
style="width: 100%;"
:picker-options="pickerOptions"
/>
data(){
return{
gysForm:{
year:''
}
}
},
methods:{
pickerOptions: {
//disabled为函数,返回值为布尔值,
disabledDate: (time) => {
let minYear = new Date().getFullYear() - 30
return time > Date.now() || time.getTime() < new Date(JSON.stringify(minYear))
}
},
}
选择年月

<el-date-picker v-model="selectMonth" type="month" placeholder="选择月" @change="jobSearch" value-format="yyyy-MM"></el-date-picker>
<script>
export default {
data() {
return {
selectMonth:''
}
},
created() {
this.initData({});
},
methods: {
jobSearch() {
this.getJobListByMonth();
},
async initData(data) {
//获取当前时间
var now = new Date();
var monthn = now.getMonth()+1;
var yearn = now.getFullYear();
this.selectMonth = yearn+"-"+monthn;
this.selectUser = parseInt(sessionStorage.getItem("userid"));
// this.getWeekJobList({
// userid: sessionStorage.getItem("userid"),
// weekid: "1"
// });
this.getJobListByMonth();
},
async getJobListByMonth(data) {
}
}
}
</script>到此这篇关于el-elementUI使用el-date-picker选择年月的文章就介绍到这了,更多相关el-element el-date-picker内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
vue router导航守卫(router.beforeEach())的使用详解
导航守卫主要用来通过跳转或取消的方式守卫导航。这篇文章主要介绍了vue-router导航守卫(router.beforeEach())的使用,本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下2019-04-04
基于vue-cli、elementUI的Vue超简单入门小例子(推荐)
这篇文章主要介绍了基于vue-cli、elementUI的Vue超简单入门小例子,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧2019-04-04


最新评论