代码如下，创建页面的时候方便复制 ``` <template> <div class="app-container"> <el-card> <div> {{ state.title }} </div> <div> <el-select v-model="state.schoolID" class="select-level" size="default" placeholder="请选择校区" clearable> <el-option v-for="item in schoolList" :key="item.id" :value="item.id" :label="item.name" /> </el-select> </div> </el-card> </div> </template> <script setup lang="ts" name="tasks"> import { defineAsyncComponent, reactive, onMounted, toRefs, ref } from 'vue'; const state = reactive({ title: '更新', schoolID:null, schoolList: [ { id: 1, name: "小" }, { id: 2, name: "大" } ], }) // 这样暴露出来后页面可以直接使用schoolList,而不需要state.schoolList const { schoolList } = toRefs(state) onMounted(() => { }) </script> <style scoped="scoped" lang="scss"> .app-container { padding: 15px } </style> ```