簡單的vue日曆元件

根據公司設計圖製作了乙個簡單的日曆元件，主要包括切換上一年、上一月、下一年、下一月，鎖定開始時間、結束時間等功能，以上就是效果圖。

**html

:child="date0">
:child="date1">
**js
kim=new vue(
},date1:}}
});

vue.component("mcalendar",

},methods:else;
if(this.isdate());
};},
setdateinfo:function
(dates)else
if(this.month==1||this.month==3||this.month==5||this.month==7||this.month==8||this.month==10||this.month==12)else;
this.datalist=;
for(var i=1;i<=(num+week);i++);
if(nowend);
this.datalist.push();
}else);
};};
this.datatop=''+this.getmonthtext(this.month)+'
'+this.year+'';
},clickdate:function
(type,day,dates);
break;
default:
break;}},
isdate:function
();            return
false;
},zerofill:function
(num),
getmonthtext:function
(m);
return month;}},
template:''+
''+''+
''+''+
''+'
'+                        ''+
''+'
'+                    ''+
'日'+
'一'+
'二'+
'三'+
'四'+
'五'+
'六'+
''+                    '}
'+                    '
'+                '
'+            '
'});

Vue日曆元件的功能

本來呢,開開心心的寫完了這個功能,然後發現elemeng更新了,增加了日曆元件這個功能 我的內心機器奔潰,但是,element的日曆元件太簡單了,我感覺還是手擼乙個吧,畢竟也不是很難 實現了顯示農曆,備註功能,點選某一天為某一天新增備註的功能.引用的是他人寫好的元件 在他的基礎上增加了功能,實現了備...

vue初學實踐之路 vue簡單日曆元件 3

這一篇我們來實現管理員修改每一天剩餘數量的功能。div id calendar div id left span 要修改的日期 span li v for d in checkeddays li div v if checkeddays.length 0 label for checkedcount...

vue初學實踐之路 vue簡單日曆元件 1

最近做的專案有乙個需求，需要有乙個日曆元件供預定功能使用，之前的 過於繁瑣複雜，所以我採用vue重寫了這個元件。效果圖。只是乙個簡單的日曆元件，所以並不需要用到node伺服器，只需要乙個html檔案即可。專案基本目錄 首先在引入 vue.js script src script 貼上最主要的html...