element ui el-date-picker组件默认值方式

 更新时间:2023年12月05日 08:44:24   作者:冷冷清清中的风风火火  
这篇文章主要介绍了element ui el-date-picker组件默认值方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教

element ui el-date-picker组件添加默认值

element ui el-date-picker 组件默认当年

<el-form-item label="">
 <el-date-picker v-model="searchForm.year" dea type="year" value-format="yyyy" placeholder="请选择年度" :pickerOptions="pickerOptions">
 </el-date-picker>
</el-form-item>
searchForm: {
  year:new Date().getFullYear().toString(),
},

element ui el-date-picker 组件默认当前月份

<el-date-picker v-model="searchForm.month" type="month" value-format="yyyy-MM" placeholder="请选择选择月份">
</el-date-picker>
  created() {
    var nowDate = new Date();
    var date = {
      year: nowDate.getFullYear(),
      month: nowDate.getMonth() + 1,
      day: nowDate.getDate(),
    };
    const dayDate =
      date.year + "-" + (date.month >= 10 ? date.month : "0" + date.month);  
    var date = new Date();
    this.$set(this.searchForm, "month", dayDate.toString());
  },

new Date() 用法

var d = new Date();
d .getFullYear(); //获取完整的年份(4位)
d .getMonth(); //获取当前月份(0-11,0代表1月)
d .getDate(); //获取当前日(1-31)
d .getDay(); //获取当前星期X(0-6,0代表星期天)
d .getTime(); //获取当前时间(从1970.1.1开始的毫秒数)
d .getHours(); //获取当前小时数(0-23)
d .getMinutes(); //获取当前分钟数(0-59)
d .getSeconds(); //获取当前秒数(0-59)
d .getMilliseconds(); //获取当前毫秒数(0-999)
d .toLocaleDateString(); //获取当前日期
var mytime=d.toLocaleTimeString(); //获取当前时间
d.toLocaleString( ); //获取日期与时间

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • Vue中组件递归及使用问题

    Vue中组件递归及使用问题

    这篇文章主要介绍了Vue中组件的递归和使用问题,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-03-03
  • vue @input和@click的区别及说明

    vue @input和@click的区别及说明

    这篇文章主要介绍了vue @input和@click的区别及说明,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-10-10
  • vue中watch如何同时监听多个属性

    vue中watch如何同时监听多个属性

    这篇文章主要介绍了vue中watch如何同时监听多个属性,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-07-07
  • vue如何实现拖动图片进行排序Vue.Draggable

    vue如何实现拖动图片进行排序Vue.Draggable

    这篇文章主要介绍了vue如何实现拖动图片进行排序Vue.Draggable,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-04-04
  • 在vue中实现点击选择框阻止弹出层消失的方法

    在vue中实现点击选择框阻止弹出层消失的方法

    今天小编就为大家分享一篇在vue中实现点击选择框阻止弹出层消失的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-09-09
  • fullcalendar日程管理插件月份切换回调处理方案

    fullcalendar日程管理插件月份切换回调处理方案

    这篇文章主要为大家介绍了fullcalendar日程管理插件月份切换回调处理的方案示例,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-03-03
  • axios全局请求参数设置,请求及返回拦截器的方法

    axios全局请求参数设置,请求及返回拦截器的方法

    下面小编就为大家分享一篇axios全局请求参数设置,请求及返回拦截器的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-03-03
  • 前端vue框架select下拉数据量过大造成卡顿问题解决办法

    前端vue框架select下拉数据量过大造成卡顿问题解决办法

    这篇文章主要给大家介绍了关于前端vue框架select下拉数据量过大造成卡顿问题解决办法,文中通过示例代码介绍的非常详细,对大家学习或者使用select具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-07-07
  • vue3+element Plus实现表格前端分页完整示例

    vue3+element Plus实现表格前端分页完整示例

    这篇文章主要给大家介绍了关于vue3+element Plus实现表格前端分页的相关资料,虽然很多时候后端会把分页,搜索,排序都做好,但是有些返回数据并不多的页面,或者其他原因不能后端分页的通常会前端处理,需要的朋友可以参考下
    2023-08-08
  • 使用vue-router为每个路由配置各自的title

    使用vue-router为每个路由配置各自的title

    这篇文章主要介绍了如何使用vue-router为每个路由配置各自的title,及使用vue router的方法,需要的朋友可以参考下
    2018-07-07

最新评论