1

アップグレードするアプリがありReact 15ますReact 16

一部のインスタンスでは、動作していた選択リストのマッピングと使用が機能しReact 15なくなりました - 選択リストが次のリストを返していることがわかりました[object, Object]

これが私のコードです

  let carTypes = ["ford", "volvo", "tesla", "BMW"];

  return (
        <div>
          <select>
            {carTypes.map((carType, key) => {
              return (
                <option
                  key={key}
                >
                  <span>{carType}</span>
                </option>)
            })}
          </select>

          <ul>
            {carTypes.map((carType, key) => {
              return (
                <li
                  key={key}
                >
                  <span>{carType}</span>
                </li>)
            })}
          </ul>
        </div>
    )

したがって、上記のコードでは、選択リストはブラウザーで 4 つのオプションを含む選択リストをレンダリングします - それらはすべて読み取ります[object, Object]

以下の順序付けされていないリストは、4 つの項目を返し、4 つの車種を表示するブラウザで正しくレンダリングします。

私の推測では、選択リストのマークアップが変更されましReact 16たが、そのドキュメントは見つかりませんでした

誰かが私を正しい方向/アドバイスに向けたり、素晴らしいドキュメントを見せてくれたら!

4

2 に答える 2

0

オプションタグからスパンタグを削除

let carTypes = ["ford", "volvo", "tesla", "BMW"];

    return (
        <div>
            <select>
                {carTypes.map((carType,key) => {
                    return (
                        <option
                           key={key}
                        >
                            {carType}
                        </option>)
                })}
            </select>

            <ul>
                {carTypes.map((carType, key) => {
                    return (
                        <li
                            key={key}
                        >
                            <span>{carType}</span>
                        </li>)
                })}
            </ul>
        </div>
    )
于 2020-11-13T13:13:35.113 に答える