CODEWITHSUNDEEP
react-native
farrukh feroz
farrukh feroz

Reputation: 21

You started loading the font "Poppins_400Regular" error

i am getting this error mutiple time

You started loading the font "Poppins_400Regular", but used it before it finished loading. You need to wait for Font.loadAsync to complete before using the font.

when run the code

Upvotes: 2

Views: 2347

Answers (1)

Kieran Osgood
Kieran Osgood

Reputation: 968

In your apps entry point, usually App.jsx you can render null or a loading state whilst the fonts for your app load, and then once the loadAsync finishes you render your app, something along the lines of:

// App.jsx, or whatever your entry point is
const App = () => {
  const [fontLoaded, setFontLoaded] = React.useState(false)

  React.useEffect(() => {
    Font.loadAsync({
      "Poppins_400Regular": require("../path/to/your/font"),
    })
    .then(() => {
     setFontLoaded(true)
    }) 
  }, [])

  if (!fontLoaded) return null

  return (
    // All of your normal app ui
  )
}

Upvotes: 3

Related Questions