When we need immutable data in our component, we can just add props to reactDOM.render() function in main.js and use it inside our component.<\/p>\n
App.jsx<\/u><\/p>\n
import React from ‘react’;<\/p>\n
class App extends React.Component {<\/p>\n
render() {<\/p>\n
return (<\/p>\n
<div><\/p>\n
<h1>{this.props.headerProp}<\/h1><\/p>\n
<h2>{this.props.contentProp}<\/h2><\/p>\n
<\/div><\/p>\n
);<\/p>\n
}<\/p>\n
}<\/p>\n
export default App;<\/p>\n
main.js<\/u><\/p>\n
import React from ‘react’;<\/p>\n
import ReactDOM from ‘react-dom’;<\/p>\n
import App from ‘.\/App.jsx’;<\/p>\n
ReactDOM.render(<App headerProp = “Header from props…” contentProp = “Content<\/p>\n
from props…”\/>, document.getElementById(‘app’));<\/p>\n
export default App;<\/p>\n","protected":false},"excerpt":{"rendered":"
When we need immutable data in our component, we can just add props to reactDOM.render() function in main.js and use it inside our component. App.jsx import React from ‘react’; class App extends React.Component { render() { return ( <div> <h1>{this.props.headerProp}<\/h1> <h2>{this.props.contentProp}<\/h2> <\/div> ); } } export default App; main.js import React from ‘react’; import ReactDOM…<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"categories":[8528],"tags":[8579],"class_list":["post-74296","page","type-page","status-publish","hentry","category-reactjs","tag-using-props"],"acf":[],"yoast_head":"\n