Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

🔥 TypeScript + React Tip 🔥 I've stopped using React.FC to type my Function Components. Here's why:

54,355 görüntüleme • 3 yıl önce •via X (Twitter)

21 Yorum

Pedro Figueiredo profil fotoğrafı
Pedro Figueiredo3 yıl önce

I was using `React.VFC<Props>` which was basically `React.FC` without the children prop, but since React v18, it doesn't have the children anymore, so, I still think that `React.FC` is a good alternative to type your components in a simple manner. 👍

Joe Previte profil fotoğrafı
Joe Previte3 yıl önce

might have to redo the video then 🤣 does the other downside still apply related to generic props?

Pedro Figueiredo profil fotoğrafı
Pedro Figueiredo3 yıl önce

Yap, that's a nice one, other than that, I'd say there is another super minor and perhaps opinionated downside for `React.FC/VFC`, which is, they also allow the old ways of defining prop types, meaning: - propTypes - defaultProps And I certainly don't want people using those 😅

Joe Previte profil fotoğrafı
Joe Previte3 yıl önce

Lol ahh okay. Well good to know then it still isn't the best way to type components (I also wouldn't want people to use propTypes or defaultProps)

⚡️Federico (rawnly) profil fotoğrafı
⚡️Federico (rawnly)3 yıl önce

Children has been removed from FC since react 18 🥲

Joe Previte profil fotoğrafı
Joe Previte3 yıl önce

😅😅😅😅

Kishore Andra (KcH) profil fotoğrafı
Kishore Andra (KcH)3 yıl önce

@tscoursedotcom This one is a cool video, Joe is killing with expressions 😍 ....

Joe Previte profil fotoğrafı
Joe Previte3 yıl önce

@tscoursedotcom haha thanks Kishore! Glad you liked it 🙏

Kishore Andra (KcH) profil fotoğrafı
Kishore Andra (KcH)3 yıl önce

@tscoursedotcom absolutely Joe 💯, if it was an YT video the jump from chair reaction would be the ultimate thumbnail 😉

Jake Moreland profil fotoğrafı
Jake Moreland3 yıl önce

removed, i believe you can then utilise PropsWithChildren if you wish to then include the broad acceptance of children whilst still using FC

Joe Previte profil fotoğrafı
Joe Previte3 yıl önce

moving this to top of replies 👇 may have to make a follow up video lol

Ross McIntyre profil fotoğrafı
Ross McIntyre3 yıl önce

children was removed from React.FC in React 18, so that's no longer an issue.

Sujal Shah ✦ profil fotoğrafı
Sujal Shah ✦3 yıl önce

Thanks for this wonderful explaination!

Joe Previte profil fotoğrafı
Joe Previte3 yıl önce

Glad you enjoyed it :D

Khairallah AL-Awady profil fotoğrafı
Khairallah AL-Awady3 yıl önce

Great tip, Joe!

Talha Altınel profil fotoğrafı
Talha Altınel3 yıl önce

mega cursed

Peter Piekarczyk (🥧🚗🐥) profil fotoğrafı
Peter Piekarczyk (🥧🚗🐥)3 yıl önce

Wow I've been doing this for months out of my lack of desire to look into how to do it correctly 😂

Alejandro profil fotoğrafı
Alejandro3 yıl önce

There are also some helpful utility types like Omit, Exclude, Pick

Incalapabler profil fotoğrafı
Incalapabler3 yıl önce

I really hate having too many exceptions. How are beginners going to learn when there’s deprecated code everywhere?

Joe Previte profil fotoğrafı
Joe Previte3 yıl önce

@veryfastsimba apparently it was removed in React 18 so this video may be outdated 🤣

Benny Neugebauer profil fotoğrafı
Benny Neugebauer3 yıl önce

Thanks for this info! Now I have to update my own React cheat sheet: 😅

Benzer Videolar