set default value for select in react js

default value is not working on simple html selection. You can do using the condition in the option in select like this.

<select
  name="gender"
  onChange={this.changeHandler}
   //onload this value must show in select input
  required
  style={styles.select}
>
  <option style={styles.option} value="Male" selected={this.state.items.gender === "Male"}>
    Male
  </option>
  <option style={styles.option} value="Female" selected={this.state.items.gender === "Female"}>
    Female
  </option>
</select>;

This works perfectly fine to me.

import { useState } from 'react';

export default function App() {
  const [gender, setGender] = useState('Female');

  return (
     <select
       name="gender"
       onChange={/* on change handler function */}
       defaultValue={gender}
       required
     >
       <option value="Male">Male</option>
       <option value="Female">Female</option>
     </select>
  );
}