Props چیست؟ اگر در حال یادگیری برنامه نویسی Reactjs/React Native هستید یا قصد شروع آن را دارید یکی از بخش هایی که در طول کد نویسی با آن سر و کار دارید props و state ها می باشند. به همین منظور در این مطلب با هم دیگه با مفهوم props آشنا میشیم.در کل ما از props و state برای ذخیره کردن اطلاعات موقت در برنامه خودمون استفاده می کنیم یعنی با هربار باز و بسته شدن برنامه این اطلاعات از بین می روند.اما فرق props با state این هست که اطلاعات props در طول برنامه ثابت و غیر قابل تغییر می باشد اما state قابلیت تغییر اطلاعات را دارد.
دوره های شبکه، برنامه نویسی، مجازی سازی، امنیت، نفوذ و ... با برترین های ایران
نحوه استفاده از props
با props ما اطلاعاتی که نیاز داریم و به هر تگی که بخواهیم میتونیم پاس بدیم و بسته شرایط این اطلاعات و در داخل تگ میتونیم نمایش دهیم یا عملیات های مختلف و روش انجام بدیم.فرض کنید یک تگ به شکل زیر داریم
<View>
<Heading '/>
</View>
این تگ خیلی ساده هست و هیچ props ایی ندارد اما اگر بخواهیم به این تگ Heading یک props نیز اضافه کنیم باید در کد های کامپوننت Heading به شکل زیر عمل کنیم
export default class Heading extends React.Component {
render () {
return (
<View>
<Text>{this.props.message}</Text>
</View>
)
}
}
در کد که بالا گفتیم هروقت از تگ Heading استفاده کردیم میتونیم یک props با نام message به این تگ پاس دهیم و این تگ هم اطلاعات این props و داخل یک متن نمایش می دهد نحوه دسترسی یه props به شکل زیر می باشد.
this.props.anyname
حالا به شکل زیر در هر صفحه که از تگ Heading استفاده کردیم میتونیم props ایی با نام message به آن پاس دهیم.
<View>
<Heading message={'any text...'}/>
</View>