이처럼 상태가 필요하지 않다면 React 컴포넌트를 함수로 선언할 수 있다. 다시 말해 상태비저장 컴포넌트를 생성하려면 함수로 선언하라는 것이다. 다음 예제에서 Link는 상태비저장 컴포넌트다.

function Link(props) {
  return <a href={props.href} target="_blank" className="btn btn-primary">
  {props.text}</a>
}
ReactDOM.render(
  <Link text='Buy React Quickly'
  href='https://www.manning.com/books/react-quickly'/>,
  document.getElementById('content')
)

 

자동 바인딩을 할 필요는 없지만, 화살표 함수를 사용해 코드를 짧게 작성할 수 있다(한 문장일 경우에는 한 줄로 표기할 수도 있다).

const Link = props => <a href={props.href}
  target="_blank"
  className="btn btn-primary">
      {props.text}
</a>