使用Vue做一个自定义的日历小控件

废话少说，先上效果图：

可以在效果图中看到，选择不同的月份的时候当月天数与星期几都是一一对应，非当月天数则是灰色显示，一目了然。

并且此日历控件支持自动确定当前时间，每次打开默认显示的就是最新的月份，用来做签到打卡的功能比较合适。

由于使用的是原生div进行制作，自定义功能非常强，可以自由的更换样式、背景、颜色、大小等等。

在与数据库的时候可以从数据库获得时间信息并填充到控件中，图中的色块就可以看出。

该控件使用了Vue、CSS、以及最原生的div实现了自定义的样式，不得不说，div在自定义这一块是真的太给力了

代码如下：

    
    
    



	

		

			

				
日历控件
				

					
						
							{{year}}年
						
					
				
				

					
						
							{{month}}月
						
					
				
			
			

				

					
SUN
					
MON
					
TUE
					
WED
					
THU
					
FRI
					
SAT
				
				

					
{{day}}
					
{{day}}
					
{{day}}
				
				

					

						

						
未更新
					
					

						

						
有更新