React Js：我如何使用索引號來禁用按鈕（如果索引 = 4 則禁用按鈕）

Question

在此處輸入圖像描述我必須創建一個組件，其中一個人最多可以添加 4 個地址來執行此操作 我在 map function 中使用了 slice(0,4) 但我必須在輸入 4 個地址時禁用按鈕

我該怎么做我需要一個解決方案

在此處輸入圖像描述

Answer 1

我想你在你的退貨聲明中尋找這樣的東西：

        <Button
          className="btn-info btn-sm"
          type="button"
          onClick={(e) => clicked(e)}
          disabled={locations.length >= 4}
        >
          Add Address
        </Button>

我認為您想使用 map.size() 作為禁用條件而不是索引中的地址數。

請注意，我一直在使用Bootstrap組件，因此該按鈕是一個嵌入式小部件。 如果您不使用 UI 小部件庫，那么您應該考慮使用它來簡化操作。

Answer 2

if(locations.length < 4) { <button type="button"> Add </button> }所以基本上按鈕會根據條件是真還是假來顯示或消失。