211111 리액트 입문 컴포넌트 함수의 반환

#컴포넌트 함수의 반환값

import React from 'react';

export default function App(){
	return <div>하이</div>;
	return <Counter/>;
	return '문자';
	return [1,2,3];
	return [<p>??</p>,<p>3</>]; //X 배열로 반환시 리액트 요소는 키값을 가져야함
	return [<p key={1}>??</p>,<p key={2}>33</p>]; //O 배열로 반환시 리액트 요소는 키값을 가져야함
	return <React.Fragment> <p>안녕</P><p>하냐</p></React.Fragment> //키가 없어도 순서를 지정
	return <> <p>안녕</P><p>하냐</p></> //프래그먼트로 동작 자동 키가 없어도 순서를 지정
	return <div> <p>안녕</P><p>하냐</p></div> //원치않은div  깊이 들어남
	return <>
      <p>하이</p>
      {count.value >0 && <Title title={count.value}/> //조건부 렌더링. 양수일때만 그린다
    </> // 조건부 렌더링 -> 나중에 다시 볼것
  	return (
      <>
        {ReactDom.createPortal(
          <div>
          	<p>하위</p>
          </div>,
          docoment.getElementById('something'),
        )}
      </>
    ); /*9. 리액트 포탈. html에서 <div id='root'></div><div id='something'></div>에서
        리액트 돔의 함수를 사용한다. createPortal(리액트요소,이전에 추가했던 html의 요소)
        import ReactDom from 'react-dom'; 필요
        보통 모달사용시에 사용한다.*/
}