प्रतिक्रिया सहारा
प्रॉप्स रिएक्ट घटकों में पारित तर्क हैं।
HTML विशेषताओं के माध्यम से घटकों को प्रॉप्स पास किए जाते हैं।
props गुण के लिए खड़ा है।
प्रतिक्रिया सहारा
रिएक्ट प्रॉप्स जावास्क्रिप्ट में फ़ंक्शन तर्कों और HTML में विशेषताओं की तरह हैं।
किसी घटक में प्रॉप्स भेजने के लिए, HTML विशेषताओं के समान सिंटैक्स का उपयोग करें:
उदाहरण
कार तत्व में "ब्रांड" विशेषता जोड़ें:
const myelement = <Car brand="Ford" />;propsघटक एक वस्तु के रूप में तर्क प्राप्त करता है :
उदाहरण
घटक में ब्रांड विशेषता का उपयोग करें:
function Car(props) {
return <h2>I am a { props.brand }!</h2>;
}
प्रमाणन हासिल करें!
$95 नामांकन
डेटा पास करें
प्रॉप्स यह भी है कि आप पैरामीटर के रूप में एक घटक से दूसरे घटक में डेटा कैसे पास करते हैं।
उदाहरण
गैराज घटक से कार घटक को "ब्रांड" गुण भेजें:
function Car(props) {
return <h2>I am a { props.brand }!</h2>;
}
function Garage() {
return (
<>
<h1>Who lives in my garage?</h1>
<Car brand="Ford" />
</>
);
}
ReactDOM.render(<Garage />, document.getElementById('root'));
यदि आपके पास भेजने के लिए एक चर है, और ऊपर के उदाहरण में एक स्ट्रिंग नहीं है, तो आप केवल चर नाम को घुंघराले कोष्ठक के अंदर रखें:
उदाहरण
नाम का एक वेरिएबल बनाएं carNameऔर इसे
Carकंपोनेंट को भेजें:
function Car(props) {
return <h2>I am a { props.brand }!</h2>;
}
function Garage() {
const carName = "Ford";
return (
<>
<h1>Who lives in my garage?</h1>
<Car brand={ carName } />
</>
);
}
ReactDOM.render(<Garage />, document.getElementById('root'));
या अगर यह एक वस्तु थी:
उदाहरण
नाम की एक वस्तु बनाएं carInfoऔर उसे
Carघटक को भेजें:
function Car(props) {
return <h2>I am a { props.brand.model }!</h2>;
}
function Garage() {
const carInfo = { name: "Ford", model: "Mustang" };
return (
<>
<h1>Who lives in my garage?</h1>
<Car brand={ carInfo } />
</>
);
}
ReactDOM.render(<Garage />, document.getElementById('root'));
नोट: रिएक्ट प्रॉप्स केवल पढ़ने के लिए हैं! यदि आप उनका मान बदलने का प्रयास करते हैं तो आपको एक त्रुटि मिलेगी।