優化點：選中的年份由父元件傳入，不傳即預設為空

step：

<template>
  <el-select v-model="currentYear">
    <el-option v-for="item in tempYearList" :key="item.value" :label="`${item.text}學年`" :value="item.value" />
  </el-select>
</template>
<script>
export default {
  model: {
    prop: 
 
'selectedYear',
    event: 'yearChange'
  },
  props: {
    yearList: Array,
    selectedYear: Number // model.prop為selectedYear，這裡就用selectedYear接收，預設是'value'
  },
  watch: {
    currentYear: {
      handler(newVal) {
        this.$emit('yearChange', newVal)
      }
    }
  },
  data() {
    return {
      currentYear: 
 
this.selectedYear,
      tempYearList: []
    }
  },
  created() {
    this.yearList && this.yearList.length
      ? (this.tempYearList = this.yearList)
      : (this.tempYearList = [
          {
            text: '2022',
            value: 2022
          },
          {
            text: '2021'
 
,
            value: 2021
          },
          {
            text: '2020',
            value: 2020
          }
        ])
  }
}
</script>

2、引入並使用：

  data() {
    return {
      selected: 2020
  },
  methods: {
    handleSubmit() {
      console.log('已選年份', this.selected)
    }
  }

    <SchoolYear v-model="selected"></SchoolYear>
    <SchoolYear :selectedYear="selected" @yearChange="selected=$event"></SchoolYear>
    <button @click="handleSubmit">點選</button>

注意：如果使用v-model="selected"去替代:selectedYear="selected" @yearChange="selected=$event"，那麼SchoolYear.vue元件中必須要重新宣告model的prop和event，否則不用宣告。