我正在创建一个注册表单,用户必须选择出生日期。
我正在浏览一个月的列表和相应的输出日。
let selectedMonth = 'April'
new Vue ({
el: '#app',
data: {
months: [
{month: 'January', days: 31},
{month: 'February', days: 28},
{month: 'March', days: 31},
{month: 'April', days: 30},
{month: 'May', days: 31},
{month: 'June', days: 30},
{month: 'July', days: 31},
{month: 'August', days: 31},
{month: 'September', days: 30},
{month: 'October', days: 31},
{month: 'November', days: 30},
{month: 'December', days: 31},
]
},
computed: {
filterDays() {
return this.months.filter(function(value) {
return value.month === selectedMonth;
});
}
},
});<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.min.js"></script>
<div id = "app">
<select id="dob">
<option v-for="day in filterDays" :value="day.days">{{ day.days }}</option>
</select>
</div>上面的程序只是输出<option value = "30">30</option>,而不是循环day in 30。
发布于 2018-04-07 17:00:01
filterDays返回一个月份对象集合。如果要对一个数字进行循环,请使用它作为循环源:filterDays[0].days。
<option v-for="day in filterDays[0].days" :value="day">{{ day }}</option>或者通过返回计算的天数来修复计算的函数。
computed: {
filterDays() {
// Select the first item here.
const month = this.months.filter(value => value.month === selectedMonth)[0];
// If the month was found, return its days, otherwise, undefined.
return month && month.days;
}
},https://stackoverflow.com/questions/49709745
复制相似问题