I have a checkbox. If the checkbox is checked, the form check should checked. But it doesn't work for me. I have the following code:
import React, { useState } from 'react'
import { Row, Form, Container } from 'react-bootstrap'
import subMenu from '../subMenu.js'
function TestScreen() {
const [test1, setTest1] = useState(subMenu)
const subMenuHandler = (e) => {
let sMenu = test1
sMenu.forEach(sm => {
if (sm._id === Number(e.target.value))
sm.isChecked = e.target.checked
})
setTest1(sMenu)
}
this is my form:
return (
<Container fluid>
<Row className="mx-xs-auto">
<Form>
<div key='default-checkbox' className="mb-3" >
{test1.map(sm => (
<Form.Check
type="checkbox"
id={sm._id}
label={sm.nama}
key={sm._id}
value={sm._id}
checked={sm.isChecked}
onChange={subMenuHandler}
/>
))}
</div>
</Form>
</Row>
</Container >
)
the stat isChecked is successfully change to true, but the formcheck not change to checked,
this is my data:
const subMenu = [
{
_id: 1,
nama: 'submenu-1',
category: 'Electronics',
harga: 89.99,
id_menu: 1,
isChecked: false
},
{
_id: 2,
nama: 'submenu-2',
category: 'Electronics',
harga: 89.99,
id_menu: 1,
isChecked: false
},
{
_id: 3,
nama: 'submenu-3',
harga: 599.99,
id_menu: 2,
isChecked: false
},
]
in the state isChecked has change to true, So where i have wrong? I don't undersanding...
Aucun commentaire:
Enregistrer un commentaire