//App.js
import React from 'react';
import Subject from './subject'; //subject.js에서 Subject Class를 가져온다.

function App() {
  return ( //Subject 호출
    <div className="App">
		<Subject title="React start 2021"></Subject>
      	  	<Subject title="Hello!"></Subject>
    </div>
  );
}

export default App;
//subject.js
import React from 'react';

class Subject extends React.Component{
	render(){
		return(
			<div>
				<h1>Hello! {this.props.title}</h1>
			</div>
		);
	}
}

export default Subject;

 

1. props 표현 문법

{this.props.name}

 

subject.js에서 this.props.title을 작성하였고, 그로인해 App.js에서 title값을 변경할 수 있게 됫으며, 같은 Subject class라도 서로 다른 값을 출력할 수 있게 되었다.

'FrontEnd > React' 카테고리의 다른 글

[React] Component 생성  (0) 2021.09.05
[React] state , Lifecycle  (0) 2021.08.24
[React] Components, Props  (0) 2021.08.20
[React] 시계  (0) 2021.08.19
[React] 리액트(React)  (0) 2021.08.17