How to set values by default using checkboxes?

September 10, 2023

I’m using a Map to store the state of my checkboxes. My current component has 3 sections. In each section I have checkboxes. I would like to set these values by default:

const defaultOptions = [
    { label: "Mark", value: "mark" },
    { label: "Steve", value: "steve" },
    { label: "Paul", value: "Paul" }
];

How can I use this array and set values by default? Thanks in advance!

Here’s a live DEMO

>Solution :

You can aggregate the values in the array into a Map based on the post label.

setCheckboxStates(defaultOptions.reduce((acc, curr) => {
  const key = someJson.find(p => p.fields.some(f => f.name === curr.label)).label;
  if (!acc.has(key)) acc.set(key, []);
  acc.get(key).push(curr);
  return acc;
}, new Map()));