ThreadNextjs 新手請教 i18n 的問題

7 messages · 14:33–14:28

Nextjs 新手請教 i18n 的問題已串好 next-i18next 目前在做當使用者一進入畫面，我要判斷一些東西來切換預設語言如 localStorage 跟 browser 還有其他的東西(根據 api call，但這優先度最低) 我配合了一個類似 isLoading 的 state 想要做到切換了語言，才顯示畫面 code 大概像是 router.push(local) setState(false) // ... if (isLoading) reutrn <Loading /> return <App /> 但是，最後出來的結果都是畫面出來了，語言才切換所以會看到瞬間語言切換有沒有用 next-i18next 的大大處理過這問題怎麼能做到，語言切換了，才顯示出我的畫面，避免 flicker 該從什麼時機點處理 thanks for all

14:33

M
Matt Pocock
你得用cookie
14:42
D
DanSnow
你的描述我沒辦法判斷你是不是還是有用到 nextjs 的 ssr ，你用顯示原始碼看 html 裡面是有內容的嗎？如果有，我猜是因為你的 js 或是 api 還在載入中，但 html 已經載入完成了，才會顯示 server 端的預設語言，如果要避免這種情況，一開始就要有個 loading 畫面並確定語言偵測已經做完才移除 loading 畫面
03:30
1. A
  a b
  不可能是「js 還在載入中」，我已經在 useEffect 之中，並且抓到到 localStorage 的 value 「API 還在載入」中，我不知道你是什麼意思我一開始就是在問這個，那你知道你所謂的「語言偵測已經做完」這件事怎麼做嗎？
  13:01
  1. D
    DanSnow
    請問你的意思是你在 useEffect 中去取 localStorage 中的語言，然後才去設定語言嗎？如果是，那就是 React render 完後，你才開始設定語言，這樣就有可能出現預設的語言，你需要的是在設定語言前，將頁面用 loading 的方式之類的藏起來
     02:51
    1. A
      a b
      有個 state 管理著。一開始 state = false 時，是顯示 Loading 所以最一開始是顯示 Loading UI 接著 effect 裡面才去 1. 判斷要切換哪個語言 2. 然後 route.push 切換語言 3. setState = true 4. state 被設為 true 了，所以接下來這次 render 才顯示 App 內容
       13:38
      1. D
        DanSnow
        對，可以試看看，如果這個速度很快的話，其實可以考慮讓你的 app 直接顯示白畫面，會比一閃而逝的 loading 給人的感覺要來得好
         14:28