[React] props, state


Reactのデータの管理


props(properties)もstateも通常のJSオブジェクトであり,Reactでのデータ管理に用いられる.

props


propsは親コンポーネントから子コンポーネントに渡すことができ、逆方向にはできません.
defaultProps値でデフォルト値を設定し、prop-typesを使用してデータ型を指定できます.
import React from 'react';
import Comp from './Comp';

class App extends React.Component {
	render() {
    	return(
        	<Comp name="프로퍼티' />
        )
    }
}

export default App;

state


構成部品内で宣言されたデータ.値を変更できるため、stateを使用して動的データを処理する必要があります.
ただし、state値を直接変更することはできません.関数で変更する必要があります.クラス構成部品はsetStateメソッドを使用し、関数構成部品はhookを使用します.
(Reactは状態の変更を検出して再レンダリングするため、setStateを使用しないと変更は検出できません)
import React from 'react';
import Comp from './Comp';

class App extends React.Component {
  state = {
  	
  }
  
	render() {
    	return(
        	<Comp name="프로퍼티' />
        )
    }
}

export default App;