Vue el-date-picker 日期组件的使用

最新推荐文章于 2025-10-18 16:01:58 发布

转载

最新推荐文章于 2025-10-18 16:01:58 发布 · 1.1w 阅读

9 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/zhoushuang0426/p/10606863.html

文章标签：

#javascript #ViewUI

本文详细介绍了Vue中el-date-picker组件的使用，包括显示年月、选择年月日以及显示年月日时分秒的配置方法，提供了对应的JS代码示例，帮助开发者更好地理解和应用这一日期选择组件。

一:显示年月

<el-date-picker v-model="selectMonth" type="month" placeholder="选择月"   @change="jobSearch" value-format="yyyy-MM"></el-date-picker>

js代码:

<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>

二:选择年月日</