How to add default value to react creatable skills

Question

I have been trying to add a default value on using react-creatable-skills after fetching data from API. I have followed the documentation but could not achieve the required results

     className="react-select4"
       classNamePrefix="react-select4"
         isClearable
         isMulti={true}
        components={{ DropdownIndicator }}
        placeholder="Enter Skills"
        options={skilloptions}
        defaultValue={{ value: 'red', label: 'Red' }}
        onChange={e=>{setskill(e)
          setskillerr(false)
          }}
        onCreateOption={handleCreateSkill}
        value={skill}
      />

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

As per the code, the results should have appeared with the default value "red" but it's not showing.

Answer 1

You can assign a default value in useState as 'red', if your component behaves similar to input tag.

const [skill,setSkill] = useState('red')
<YourComponent
        onChange={e => {
          setskill(e.target.value)
          setskillerr(false)
          }}
        value={skill}
        />