props in classes
// Component.js
import React from 'react';
export default class MyClassComponent extends React.Component {
render() {
return (<div>
{/* В классовом компоненте props доступны через this */}
Hello Class, {this.props.name}!
</div>);
}
}pass props in react
/* PASSING THE PROPS to the 'Greeting' component */
const expression = 'Happy';
<Greeting statement='Hello' expression={expression}/> // statement and expression are the props (ie. arguments) we are passing to Greeting component
/* USING THE PROPS in the child component */
class Greeting extends Component {
render() {
return <h1>{this.props.statement} I am feeling {this.props.expression} today!</h1>;
}
}React js props
function App() {
return (
<div className="App">
<NewComponent name="Ariful Islam Adil" profession="Web-Developer"></NewComponent>
</div>
);
}
function NewComponent(props) {
return (
<div className="test-class">
<h1>Name: {props.name}</h1>
<h3>Profession: {props.profession}</h3>
</div>
)
}
export default App;props react
function Welcome(props) { return <h1>Hello, {props.name}</h1>;
}
const element = <Welcome name="Sara" />;ReactDOM.render(
element,
document.getElementById('root')
);Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
