簡単に書くためdiv
を例に。
これは余裕で書ける。
render() { return ( <div /> ); }
しかし、以下のように2つ書いたら当然のように怒られる。
render() { return ( <div /> <div /> ); }
[tslint] unused expression, expected an assignment or function call (no-unused-expression) [ts] コンマ演算子の左側が使用されていないため、副作用はありません。 (property) JSX.IntrinsicElements.div: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>
だからと言って、上の階層にdiv
で囲ってやればエラーにはならないが、本来の目的とは異なる。
そもそも、一つ間に挟まるのはいただけない・・。
render() { return ( <div /> <div /> <div /> <div /> ); }
配列にする、
key
は必須。さもないと警告。
render() { return ( [ <div key="one" />, <div key="two" /> ] ); }