Vue.js 年份范围下拉框示例 | 使用 v-model 和 v-for 实现

"用Vue2展示一下只选择年份范围的下拉框"\n\n内容：在Vue.js中，可以使用v-model指令来绑定数据，使用v-for指令来循环渲染下拉框的选项。\n\n以下是一个只选择年份范围的下拉框的示例：\n\nhtml\n<template>\n <div>\n <label for=\"year\">选择年份:</label>\n <select v-model=\"selectedYear\" id=\"year\">\n <option v-for=\"year in years\" :value=\"year\">{{ year }}</option>\n </select>\n </div>\n</template>\n\n<script>\n export default {\n data() {\n return {\n selectedYear: null,\n years: []\n };\n },\n mounted() {\n // 获取当前年份\n const currentYear = new Date().getFullYear();\n\n // 生成年份范围从当前年份到 1900 年\n for (let year = currentYear; year >= 1900; year--) {\n this.years.push(year);\n }\n }\n};\n</script>\n\n\n在上述代码中，我们使用v-model指令将selectedYear绑定到下拉框的值，这样当用户选择一个年份时，selectedYear的值也会相应地更新。\n\n使用v-for指令循环渲染years数组中的年份作为选项。在mounted生命周期钩子中，我们获取当前年份，并生成一个从当前年份到 1900 年的年份范围，将其存储在years数组中。\n\n这样就可以展示一个只选择年份范围的下拉框了。