解决页面渲染问题

src/modules/admin/contest/dashboard/views/Index.vue

@@ -59,10 +59,16 @@ onUnmounted(() => {
   timer && clearInterval(timer)
 })
 
-const statistics = reactive({ competitor_count: 0, complete_answer_competitor_count: 0, starting_answer_competitor_count: 0 })
+const key = ref(0)
+const statistics = reactive({
+  competitor_count: 0,
+  complete_answer_competitor_count: 0,
+  starting_answer_competitor_count: 0
+})
 async function fetchStatistics(competition_id: string, platform_key = 'career_data_analysis') {
   const res = await getCompetitionStatistics({ competition_id, platform_key })
   Object.assign(statistics, res.data.detail)
+  key.value++
 }
 
 const competitorsList = ref([])
@@ -189,7 +195,7 @@ function getModuleStatus(row: any, index: number) {
 </script>
 
 <template>
-  <AppCard>
+  <AppCard :key="key">
     <h2 class="end-countdown">
       结束倒计时：<span>{{ countdown }}</span>
     </h2>
@@ -198,7 +204,12 @@ function getModuleStatus(row: any, index: number) {
         <el-option v-for="item in competitionList" :key="item.id" :value="item" :label="item.name"></el-option>
       </el-select>
       <el-select v-model="platformKey" size="large">
-        <el-option v-for="item in platformKeys" :key="item.platform_key" :value="item.platform_key" :label="item.name"></el-option>
+        <el-option
+          v-for="item in platformKeys"
+          :key="item.platform_key"
+          :value="item.platform_key"
+          :label="item.name"
+        ></el-option>
       </el-select>
     </el-row>
     <ul class="statistics">