noineくんと以前話していて、コンポーネントもオブジェクトだよねって話題に出てきた話

コンポーネントを条件によって出し分ける

useEffectで何らかの条件の元コンポーネントを出し分けたい場合

//条件によってデータの種類が変わる、条件がない場合は何も表示したくない
const Component = ({ 条件1,条件2 }: Props) => {
const [data,setData]=useState (null)

  useEffect(() => {
    if(条件1,条件2){
    //条件によってデータA,B,Cを出力
    const result = witchDataType(条件1,条件2)
    setData(result)
    }
  }, [条件1,条件2]);

//データがあればコンポーネントを出力そうでなければ何も出さん
  return data ?  : <>;
};

のところ

//条件によってデータの種類が変わる、条件がない場合は何も表示したくない
const Component = ({ 条件1,条件2 }: Props) => {
const [elm,setElm] = useState(<>)

  useEffect(() => {
    if(条件1,条件2){
    //条件によってデータA,B,Cを出力
    const result = witchDataType(条件1,条件2)
    //ここでコンポーネントをstateに格納しちゃう
    setElm()
    }
  }, [条件1,条件2]);

  return {elm};
};

でもokだよね

という話をしました