时间转换人

原创于 2024-01-10 18:10:20 发布 · 406 阅读

9 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #前端 #javascript

文章详细描述了如何在Vue项目中使用ElementUI日期组件时，设置其初始视图为当前月份的第一天和最后一天。作者提供了创建方法和数据绑定的示例代码。

vue elementUI 日期组件默认当前月份第一天与当前月份最后一天

  1. template中如下代码：   
          
              
              至

2.data中

      startTime: '',
      endTime: '',

3.created中

  created() {
    this.getCurrentMonthFirst()
    this.getCurrentMonthLast()
  },

4.methods中

    getdateValue (val) {
      this.startTime = val
      this.getbalanceIndexData()
    },
    getdateVal (val) {
      this.endTime = val
      this.getbalanceIndexData()
    },

   getCurrentMonthFirst () {
      var date = new Date()
      date.setDate(1)
      var month = parseInt(date.getMonth() + 1)
      var day = date.getDate()
      if (month < 10)  month = '0' + month
      if (day < 10)  day = '0' + day
      this.startTime = date.getFullYear() + '-' + month + '-' + day
    },
   getCurrentMonthLast () {
      var date = new Date()
      var year = date.getFullYear()
      var month = date.getMonth() + 1
      month = month < 10 ? '0' + month : month
      var day = new Date(year, month, 0)
      this.endTime = year + '-' + month + '-' + day.getDate()
    },