+1
Dùng document để check checkbox nhưng ko thay đổi state trong react
em có cái checkbox này
const [check, setCheck] = useState(false);
const handleChange = (e) => {
setCheck(e.target.checked);
};
return (
<input
type="checkbox"
className={styles.fixcheck}
checked={check}
onChange={handleChange}
/>
);
};
em mong muốn thay đổi checkbox = code nên đã làm như sau: document.getElementsByClassName('....').checked = true;
checkbox có thay đổi nhưng state của nó lại không đổi, mọi người giúp e vs ạ, e cảm ơn
Thêm một bình luận
2 CÂU TRẢ LỜI
+1
Ko rõ bạn tại sao muốn làm vậy nhưng muốn dùng js thay đổi giá trị input rồi kéo theo kích hoạt onChange của react thi phải làm như sau:
Đại loại là dispatch event click cho cái input đó.
<div id="app">
</div>
<button onclick="clickButton()">Change input state</button>
<script>
function clickButton() {
const input = document.querySelector('input');
Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, 'checked').set.call(input, !input.checked);
input.dispatchEvent(new Event('click', { bubbles: true}));
}
</script>
Full demo codepen: https://codepen.io/ohmygodvt95/pen/dyWjggw
=> nói chung không nên làm cách này, hãy chỉ dùng react code thôi.