vue3使用axios返回json用v-for遍歷失效，標籤不渲染

遇到vue用axios請求後端json對象，發現vue頁面對應的v-for標籤怎麼都不渲染。

首先控制檯打印數據正常，以爲錯誤出現在生命週期鉤子上面。
axios請求在dom渲染之後，但是一頓操作之後還是沒有用。

參考了很多種方法，
第一種就是在v-for外面包一層v-if，判斷收到的數據不爲空才顯示。

<div v-if="list.length != 0">//判斷不爲空
        <div class="list" :key="index"  v-for="item,index in list">
            <div class="body">
                <div class="img">

結果還是失敗。究其本身他v-for本身不渲染，判斷是否爲空並沒有什麼意義。

第二種，使用setTimeout延遲加載axios。
仍然未果…

然後不斷的找不斷地調試，最後解決了問題。
axios請求過來的json對象打印爲數組，一開始我是用的ref()變爲響應式，但是數組應該在定義初始化的時候用reactive。

const list = reactive([]) as any[];

加as any[] 是因爲用ts會報錯。
使用axios獲取到result對象之後，取得result.data的對應的json對象，通過foreach遍歷然後把每一個對象數組push到自己定義的響應式數組中。不能直接賦值，比如說list = res.data。
具體代碼：（這裏的axios我是封裝過後的）

const list = reactive([]) as any[];//現在setup中定義
onMounted(()=>{
    axios.getList(‘url’).then(res=>{
            res.data.forEach((element: any) => {
                list.push(element);//循環賦值
            });
            console.log(list)
    })    
})

然後就可以用v-for遍歷再用{{}}取值顯示了。
中途還用過好多方法，可惜都沒用。