Element-UI plus 自定义-下拉框选择年份【vue3】

1.实现效果


2.实现代码展示

javascript 复制代码
<template>
	<el-select v-model="selectedYear" placeholder="请选择">
	  <el-option
		v-for="year in yearOptions"
		:key="year"
		:label="year"
		:value="year">
	  </el-option>
	</el-select>
  </template>

  <script setup>
  import { ref, onMounted } from 'vue';
  import { getCurrentInstance } from 'vue';

  const selectedYear = ref('');
  const yearOptions = ref([]);

  onMounted(() => {
	const currentYear = new Date().getFullYear();
	selectedYear.value = String(currentYear);
	for (let i = currentYear; i >= 2010; i--) {
	  yearOptions.value.push(String(i));
	}
  });
  </script>

相关推荐
黄贵根12 小时前
JavaScript实现教培行业意向登记系统
开发语言·javascript·ecmascript
codeGoogle15 小时前
自研 IM 还是选择第三方 SDK?企业开发者应该如何权衡?
前端·后端·程序员
zzzzzz31016 小时前
从 react-bits 看动效组件化:别把视觉效果写成一次性页面代码
javascript·react.js·开源
用户9385156350717 小时前
React Context 与自定义 Hook 从底层到实践:「跨层级通信 + 副作用封装」全解析
前端·javascript·react.js
滴滴答答哒17 小时前
VUE3+element-plus MultiSelect 多选下拉组件
前端·javascript·vue.js
其美杰布-富贵-李17 小时前
04 watch 与 Vue 响应式数据流
前端·javascript·vue.js
赵大仁19 小时前
生成式 UI 实战:用 JSON Schema + React 动态渲染 AI 界面
前端·ai·react·next.js·前端架构·生成式ui
kyriewen20 小时前
我排查了一个React内存泄漏——罪魁祸首是这3个被忽略的清理函数
前端·javascript·面试
IT_陈寒20 小时前
我又被JavaScript的隐式类型转换坑了
前端·人工智能·后端