Uniapp 年份选择器组件：获取当前年份及之前20年并排序

<p>&quot;<template>\n  <view>\n    &lt;picker mode=&quot;selector&quot; :range=&quot;{{ yearRange }}&quot; @change=&quot;onYearChange&quot;&gt;\n      &lt;view class=&quot;picker&quot;&gt;\n        {{ currentYear }}\n      </view>\n    </picker>\n  </view>\n</template>\n\n<script>\nexport default {\n  data() {\n    return {\n      yearRange: [], // 年份范围\n      currentYear: '' // 当前选中的年份\n    }\n  },\n  mounted() {\n    this.initYearRange()\n  },\n  methods: {\n    initYearRange() {\n      const currentYear = new Date().getFullYear() // 获取当前年份\n      const range = []\n      for (let i = currentYear; i &gt; currentYear - 20; i--) {\n        range.push(i)\n      }\n      this.yearRange = range\n      this.currentYear = currentYear\n    },\n    onYearChange(event) {\n      this.currentYear = this.yearRange[event.detail.value]\n    }\n  }\n}\n</script>\n\n<style>\n.picker {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 100px;\n  background-color: #f5f5f5;\n}\n</style>\n&quot;\n在这个示例中，我们使用了<code>picker</code>组件来展示年份选择器。<code>yearRange</code>是一个数组，存储了当前年份及之前的20个年份。通过<code>for</code>循环将年份添加到<code>yearRange</code>中。<code>currentYear</code>是当前选中的年份，初始值为当前年份。<code>initYearRange</code>方法在组件初始化时被调用，用于初始化年份范围和当前选中的年份。<code>onYearChange</code>方法用于响应年份选择器的值改变事件，将选中的年份更新到<code>currentYear</code>。\n\n你可以在你的uniapp项目中使用该组件，即可实现获取年份的功能，并按照你所描述的要求进行排序。</p>