javascript - 關於react使用fetch請求資料的問題

Question

今天使用fetch去完善react專案的介面資料的時候，遇到了比較棘手的問題。
業務邏輯是：先判斷使用者的身份，然後為他展現相對應的介面。
但是fetch是非同步取得資料的，結果就出現了，頁面先渲染完，然後資料請求回來（資料請求的比頁面渲染的要慢），然後透過state,改變了頁面的顯示狀態。
這樣就出現了，頁面先展示了一個介面，然後過了1~2秒之後，狀態改變，介面又改變了，使用者體驗很差。請問有什麼解決的辦法麼。
最好是先接受了數據，再判斷完，再去渲染介面。

Answer 1

這個其實很簡單，你在render的return中做一個三元運算子。判斷數據是否獲取到。

<p>
{this.state.data==null?<p></p>:<YourTemplate/>}
</p>

還有一個想法就是你把fetch 寫在render中，把return的模版放在fetch 的then回呼中，這樣就可以實現獲取了資料再進行渲染。不過我沒有試驗，應該是可行的。
如果覺得我的回答解決了你的問題，請點擊
采纳答案
如果有什麼疑問請評論區提問。

Answer 2

弄個loading提示框，
等資料請求完以後再進行渲染頁

Answer 3

將使用者的身分的狀態先存在localStorage中，第一次先從localStorage取