Home > OS >  How To Checked Chekbox From API when data available in react?
How To Checked Chekbox From API when data available in react?

Time:10-21

I have data with Array like this

//This state categories
const [categories, setCategories] = useState([])
  
const category = [
  { id: abcd1, name: phone },
  { id: abcd2, name: computer },
  { id: abcd3, name: tv },
]

const data = [
 { id: abcd3, name: television }
]

setCategories(data)

How to checked checkbox if data is available in category? For example in checkbox tv is true.

return(
  category.map((category) => (
    <input
      type = "checkbox"
      checked = how..?
    >
    <label {categories.name} />
  ))
)

CodePudding user response:

You can use some which returns a boolean and checked takes true / false

return(
  category.map((category) => (
   <input
     type = "checkbox"
     checked = {data.some(d=> d.name === category.name)} // or check `id` whichever is feasible and you want to check your condition
   **if by `id` replace with below line**   
   // checked = {data.some(d=> d.id == category.id)}
   >
  <label {categories.name} />
  ))
)
  • Related