前端之家收集整理的这篇文章主要介绍了
Vue.js创建Calendar日历效果，
前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
使用 Vue.js 进行数据与视图的绑定，数据更新会让视图自动进行更新，类似 Android 里面的 DataBinding。
实现一个HTML的日历效果。
html 部分
= 0; i--) {
var d = new Date(str);
d.setDate(d.getDate() - i);
console.log("y:" + d.getDate());
this.days.push(d);
}
for (var i = 1; i <= 35 - this.currentWeek; i++) {
var d = new Date(str);
d.setDate(d.getDate() + i);
this.days.push(d);
}
},pick: function(date) {
alert(this.formatDate( date.getFullYear(),date.getMonth() + 1,date.getDate()));
},pickPre: function(year,month) {
// setDate(0); 上月最后一天
// setDate(-1); 上月倒数第二天
// setDate(dx) 参数dx为 上月最后一天的前后dx天
var d = new Date(this.formatDate(year,month,1));
d.setDate(0);
this.initData(this.formatDate(d.getFullYear(),d.getMonth() + 1,1));
},pickNext: function(year,month) {
var d = new Date(this.formatDate(year,1));
d.setDate(35);
this.initData(this.formatDate(d.getFullYear(),pickYear: function(year,month) {
alert(year + "," + month);
},// 返回 类似 2016-01-02 格式的字符串
formatDate: function(year,day){
var y = year;
var m = month;
if(m<10) m = "0" + m;
var d = day;
if(d<10) d = "0" + d;
return y+"-"+m+"-"+d
},});
