Photo by Fleur on Unsplash

REACT DOC SERIES

React Bileşenlerinde Prop Check

React Bileşenini dışarıdan bir takım veriler ile beslemenin yolu Props değerleri geçmek, peki bileşenin beklediği tüm prop değerler beklediğiniz gibi mi geliyor ?

React tüm uygulama kodunda tip kontrolleri sağlayacak bir yapısı yok. Zaten amacıda sadece Bileşen Render etmek olan bir kütüphanenin amacı Bileşenin düzgün çalışmasını sağlamak olmalı.. Fakat uygulamanız içerisinde React Router, Redux ve diğer iş mantıklarınıda düşününce bazen tek başına bu özellik yeterli gelmeyebilir . Bu durumda Flow veya TypeScript yani Compile Time ’da geliştiriciye uyarı verecek daha bütünsel bir araca ihtiyaç duyabilirsiniz. Bu konuda TypeScript’ in Temelleri Yazı Serisini okuyabilirsiniz.

Biz dönelim React PropTypes , Aşağıdaki Greetings name değerini ekrana basıyor fakat bunun String tipinde olmasını istiyor.

https://reactjs.org/docs/typechecking-with-proptypes.html

Eğer siz name string bir değer yerine nümerik bir değer verirseniz. Kodunuz çalışmasına rağmen şu şekilde uyarılar alırsınız.

Number Değer geçirdiğimizdeki uyar..

PropTypes desteklenen Türler

https://tr.reactjs.org/docs/typechecking-with-proptypes.html

PropTypes ilgili alanın olup/olmamasının kontrol Edilmesi

requiredFunc: PropTypes.func.isRequired,
requiredAny: PropTypes.any.isRequired,

Referanslar

• https://tr.reactjs.org/docs/typechecking-with-proptypes.html

Okumaya Devam Et 😃

Bu yazının devamı veya yazı grubundaki diğer yazılara erişmek için bu linke tıklayabilirsiniz.