万年素人からHackerへの道

万年素人がHackerになれるまで殴り書きするぜ。

  • ・資産運用おすすめ
    10万円は1000円くらい利益
    • ・寄付お願いします
      YENTEN:YYzNPzdsZWqr5THWAdMrKDj7GT8ietDc2W
      BitZenny:ZfpUbVya8MWQkjjGJMjA7P9pPkqaLnwPWH
      c0ban:8KG95GXdEquNpPW8xJAJf7nn5kbimQ5wj1

    ReactのJSXで簡単にforeach的なこと

    Reactのコンポートでfor (let i: number; i < arr.length; i++) { }

    とかだるい。

    this.arrにstringの配列があるとして、

    <tbody>
      {
        this.arr.forEach.call((item:string, index: number) => {
          return (
            <tr>
              hoge
            </tr>);
        })
      }
    </tbody>

    だとコンパイル時にエラー出ないと思ったらランタイムでエラー・・・。

    <tbody>
      {
        Array.from(this.arr).map((item:string, index: number) => {
          return (
            <tr
              key={`keyName${index}`}
            >
              hoge
            </tr>);
        })
      }
    </tbody>

    だとOK。keyはその代わり必要になる。

    ただし、Array.fromは、「配列型 (array-like) オブジェクトや反復可能 (iterable) オブジェクトから新しい Array インスタンスを生成します。」ってやつ。 もともと配列ならArray.fromが要らないので、 this.arr.map((item:string, index: number) => {でいい。