Element-ui DatePicker日期选择器基础用法示例
更新时间:2023年06月29日 09:46:27 作者:菜园前端
这篇文章主要为大家介绍了Element-ui DatePicker日期选择器基础用法示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
Element-ui DatePicker
通常用于选择日期
按需引入方式
如果是完整引入可跳过此步骤
import Vue from 'vue' import { DatePicker } from 'element-ui' import 'element-ui/lib/theme-chalk/base.css' import 'element-ui/lib/theme-chalk/date-picker.css' Vue.use(DatePicker)
基础用法
<template> <el-date-picker v-model="value" type="date" placeholder="选择日期"> </el-date-picker> </template> <script> export default { data() { return { value: '' } } } </script>
选择月份
<template> <el-date-picker v-model="value" type="month" placeholder="选择月份"> </el-date-picker> </template> <script> export default { data() { return { value: '' } } } </script>
选择年份
<template> <el-date-picker v-model="value" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"> </el-date-picker> </template> <script> export default { data() { return { value: [] } } } </script>
Attributes
以上就是Element-ui DatePicker日期选择器基础用法示例的详细内容,更多关于Element-ui DatePicker的资料请关注脚本之家其它相关文章!
相关文章
vue进入页面时不在顶部,检测滚动返回顶部按钮问题及解决方法
这篇文章主要介绍了vue进入页面时不在顶部,检测滚动返回顶部按钮问题及解决方法,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下2019-10-10
最新评论