美文网首页
vue实现年份下拉框

vue实现年份下拉框

作者: 上海_前端_求内推 | 来源:发表于2022-01-19 17:01 被阅读0次

    1,html

     <el-form-item label="预算年度">
                    <el-select
                      v-model="formselect.year"
                      placeholder="请选择"
                      filterable
                      class="searchfilter"
                      style="height: 32px; line-height: 32px; width: 150px"
                    >
                      <el-option
                        v-for="item in years"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      >
                      </el-option>
                    </el-select>
                  </el-form-item>
    

    2, js

    1,加载
     created() {
        var myDate = new Date();
        var year = myDate.getFullYear(); //获取当前年
        this.initSelectYear(year);
      },
    2,方法
     initSelectYear(year) {
          this.years = [];
          for (let i = 0; i < 30; i++) {
            this.years.push({ value: year - i, label: year - i + "年" });
          }
        },
    

    相关文章

      网友评论

          本文标题:vue实现年份下拉框

          本文链接:https://www.haomeiwen.com/subject/sjgrhrtx.html