Kufanya Kazi na Select katika React

Hebu sasa tuchukulie na orodha zinazotolewa select. Kufanya kazi nazo pia hakuna tofauti kubwa na kufanya kazi na viingilio na vibonyezo cha ukaguzi.

Wacha tuwe na kuchagua kama hii:

jsxfunction App() {
  return <div>
    <select>
      <option>maandishi1</option>
      <option>maandishi2</option>
      <option>maandishi3</option>
      <option>maandishi4</option>
    </select>
  </div>;
}

Wacha tuuhakikishe ufanyaji kazi wake kwa njia za React:

jsxfunction App() {
  const [value, setValue] = useState('');
  
  function handleChange(event) {
    setValue(event.target.value);
  }
  
  return <div>
    <select value={value} onChange={handleChange}>
      <option>maandishi1</option>
      <option>maandishi2</option>
      <option>maandishi3</option>
      <option>maandishi4</option>
    </select>
    <p>
      uchaguzi wako: {value}
    </p>
  </div>;
}
Задание 1

Tengeneza orodha inayotolewa ya miji. Tengeneza pia aya, ambayo matokeo ya kuchagua mtumiaji yatachapishwa.