React Js : How can i use index number to disable button ( if index = 4 then disable button )-CodePudding

enter image description here i have to create a component where one person can add upto 4 addresses for doing this i have used slice(0,4) in map function but i have to make button disabled when 4 addresses are entered

How can i do this i need a solution

enter image description here

CodePudding user response：

if(locations.length < 4) { <button type="button"> Add </button> } So basically the button will appear or dissapear based on if the condition is true or false.

CodePudding user response：

I think you looking for something like this in your return statement:

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

I think you want to use map.size() for the number of addresses in your disable conditional instead of index.

Note that I have been using Bootstrap components so the button is a drop-in widget. If your not using a UI widget library then you should consider it to make things easier.