Праца з radio у React
Праца з radio
radio некалькі адрозніваецца, напрыклад,
ад тых жа чэкбоксаў. Праблема ў тым, што
ў некалькіх radio будзе адзін і той жа стэйт,
але розныя value.
Таму праца адбываецца наступным чынам:
кожнай радыёкнопцы ў атрыбут value
запісваюць сваё значэнне, а ў атрыбут checked
- спецыяльная ўмова, якая правярае,
ці роўны стэйт пэўнаму значэнню. Калі
роўны - радыёкнопка стане адзначанай,
а калі не роўны - будзе не адмечанай.
Вось рэалізацыя апісанага:
function App() {
const [value, setValue] = useState(1);
function changeHandler(event) {
setValue(event.target.value);
}
return <div>
<input
type="radio"
name="radio"
value="1"
checked={value === '1' ? true : false}
onChange={changeHandler}
/>
<input
type="radio"
name="radio"
value="2"
checked={value === '2' ? true : false}
onChange={changeHandler}
/>
<input
type="radio"
name="radio"
value="3"
checked={value === '3' ? true : false}
onChange={changeHandler}
/>
</div>
}
Дадзеныя 3 радыёкнопкі. Дадзены абзац. Зрабіце
так, каб значэнне абранай радыёкнопкі
выводзілася ў гэты абзац.
З дапамогай радыёкнопак спытайце ў карыстальніка яго любімы мову праграмавання. Выведзіце яго выбар у абзац. Калі абрана мова JavaScript, пахваліце карыстальніка.