#javascript #reactjs
#javascript #reactjs
Вопрос:
У меня есть флажок ввода, значение которого всегда регистрируется на консоли как false, даже если сам флажок установлен. Я забываю что-то сделать, я не передаю что-то необходимое? Я довольно новичок в React и js. Приношу свои извинения за то, что по какой-то причине не ввел весь код, StackOverflow не позволит мне вставить все это
Спасибо за вашу помощь.
class Orders extends Component {
componentDidMount() {
this.props.fetchOrders();
}
complete = () => {
const completed = document.getElementById("complete").checked;
// console.log("this is complete", completed);
if (completed.checked === true) {
// text.style.display = "block";
console.log("im am checked");
} else {
console.log("im am NOT checked");
//text.style.display = "none";
}
};
<input>
<td>
<input
type="checkbox"
name="complete"
id="complete"
onChange={() => this.complete()}
></input>
</td>
Комментарии:
1. Я думаю, что ваше условие неверно. это должно быть
completed === true
Ответ №1:
Проверьте checked
свойство в целевом элементе. Это должно сработать.
const complete = (e) => {
if (e.target.checked) {
console.log("im am checked");
} else {
console.log("im am NOT checked");
}
};
return (
<div>
<input
type="checkbox"
name="complete"
id="complete"
onChange={(e) => complete(e)}
/>
</div>
);
Комментарии:
1. спасибо ultimoTG, что это было так, и Каспер Бидка, вы определенно пролили свет. спасибо вам обоим
Ответ №2:
Вам следует избегать использования такого селектора с React, это упускает суть библиотеки. Вероятно, это проблема, возникшая при копировании кода, но элементы html должны быть возвращены с помощью функции render() . Вместо этого вы должны передать событие в свою функцию обратного вызова и использовать событие, переданное элементом dom, следующим образом :
class Orders extends Component {
componentDidMount() {
this.props.fetchOrders();
}
complete = (e) => {
if (e.target.checked) {
console.log("im am checked");
} else {
console.log("im am NOT checked");
}
};
Комментарии:
1. Каспер Бидка, делает с тех пор, но как странно, если я регистрирую e.target.value, я возвращаюсь «вкл», каждый раз, когда я нажимаю на поле
2. Извините, передано неправильное значение, вместо этого используйте e.target.checked, отредактировал код 😉