CODEWITHSUNDEEP
reactjs
iamjpcbau
iamjpcbau

Reputation: 404

React.js: React dropdown does not hold data

I would like to ask why does my dropdown can't hold the value after selecting.

ClientMaintenancePage.js

/* Dropdown */
const optionsBrstn = [
   'BIC', 'BRSTN', 'Bank Name'
];

const defaultOption = options[0];

<form className="form-horizontal form-group">
      <Dropdown options={optionsBrstn} onSelect={_onSelect} value={defaultOption} placeholder="Select an option" />
      <div className="text-right mt-2">
            <MDBBtn color="indigo" type="button" onClick={() => {}}>Add</MDBBtn>
            <MDBBtn color="indigo" type="button" onClick={() => {}}>Delete</MDBBtn>
            <MDBBtn color="indigo" type="button" onClick={() => {}}>Save</MDBBtn>
      </div>
</form>

It was originally this._onSelect, however I am not using a class component that's why I cannot use the this keyword.

May I know what approach can I use for this using React hooks.

TIA

Upvotes: 0

Views: 37

Answers (1)

Muhammad Haseeb
Muhammad Haseeb

Reputation: 1341

It should be optionsBrstn. I can not see options variable or state.

const defaultOption = optionsBrstn[0]

One more thing, defaultOption is const so if you change the selected option on change, it will not reflect in your select. It should be kept in a state.

Upvotes: 1

Related Questions