js:
/**
*Create by {Hardy_yang} on2018/7/6
*/
var Main={
data(){
return{
model1:'',
model2:'',
num:'',
num1:'',
}
},
methods: {
change1: function (val) {
this.yearCount(val);
this.model1 = this.num;
},
change2: function (val) {
this.monthCount(val);
this.model2 = this.num1;
},
yearCount: function (val) {
if (val.length == 0) {
this.num = '';
} else {
if (val.length == 4) {
if (val % 100 == 0) {
if (val % 4 == 0) {
this.num = 365;
} else {
this.num = 365;
}
} else if (val % 4 == 0) {
this.num = 366;
} else {
this.num = 365;
}
}
}
},
monthCount: function (val) {
if (val.length == 0) {
this.num1 = '';
} else {
let month1 = [1, 3, 5, 7, 8, 10, 12];
let month2 = [4, 6, 9, 11];
let year = val.slice(0, 4);
// console.log(year)
let month = val.slice(5);
// console.log(month)
if (month == 2) {
this.yearCount(year);
// console.log(this.num)
if (this.num == 365) {
this.num1 = 28;
} else {
this.num1 = 29;
}
}
for (let i = 0; i < month1.length; i++) {
if (month1[i] == month) {
this.num1 = 31;
}
for (let i = 0; i < month2.length; i++) {
if (month2[i] == month) {
this.num1 = 30;
}
}
}
}
}
}
}
var Component=Vue.extend(Main)
new Component().$mount("#date")html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>date-judge</title>
<script src="../vueIview/vue.min.js"></script>
<script src="../vueIview/iview.min.js"></script>
<link rel="stylesheet" href="../vueIview/iview.css">
<link rel="stylesheet" type="text/css" href="date-judge.css">
<script type="text/javascript" src="../vueIview/jquery-3.3.1.min.js"></script>
</head>
<body>
<div id="date">
<div class="date1">
<date-picker type="year" placeholder="选择要查找的年份" @on-change="change1"></date-picker>
<i-input class="i1" v-model="model1"></i-input>
</div>
<date-picker type="month" placeholder="选择要查找的月份" @on-change="change2"></date-picker>
<i-input class="i2" v-model="model2"></i-input>
</div>
<script src="date-judge.js"></script>
</body>
</html>
