基于Vue+Element-Ui开发的月日组件，可以选择月份和天数小插件（新版本）-Toy模板网

这篇具有很好参考价值的文章主要介绍了基于Vue+Element-Ui开发的月日组件，可以选择月份和天数小插件（新版本）。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

最近有粉丝在使用的过程中发现不能满足自己项目上的需求，评论说不支持placeholder以及更改输入框大小size，所以又赶紧更新了一个版本，之前是1.0.7，现在新版本为1.1.0，点击查看之前的老版本

本组件是基于Vue和Element-ui，因Element官方组件库没有可以选择月份和天数的组件

之前的文章里也提到过一些问题，如发布npm包，需要设置npmjs源，之前文章写的是http，需要设置为https，不然登录的时候就会出现报错

基于Vue+Element-Ui开发的月日组件，可以选择月份和天数小插件（新版本）

如何发布包，就不多说了，看之前的文章吧，点我进入查看。

组件图

基于Vue+Element-Ui开发的月日组件，可以选择月份和天数小插件（新版本）

新版本变更内容

新增了下面这些属性

placeholder: '请选择', // 占位内容，默认为选择日期
size: 'small', // 输入框尺寸 large, small, mini 默认large
clearable: true, // 是否显示清除按钮，默认true
disabled: false, // 禁用，默认false
readonly: false, // 只读，默认false
popperClass: '', // 弹出框类名

如何使用

npm install month-days-element

<template>
    <div>
		<MonthDays v-model="monthDaysValue" :monthDaysOptions="monthDaysOptions" @getValue="getValue" />
    </div>
</template>
<script>
import MonthDays from 'month-days-element'

export default {
	components: {
	  MonthDays
	},
	data () {
		return {
			monthDaysValue: '',
			monthDaysOptions: {
				placeholder: '请选择', // 占位内容，默认为选择日期
				size: 'small', // 输入框尺寸 large, small, mini 默认large
				clearable: true, // 是否显示清除按钮，默认true
				disabled: false, // 禁用，默认false
				readonly: false, // 只读，默认false
				popperClass: '' // 弹出框类名
			}
		}
	},
	methods: {
        getValue (val) {
		    this.monthDaysValue = val
	    }
    }
}
</script>