mardi 31 mai 2022

React - How to select all checkboxes based on one without using the map function

I created a simple form in React that displays the submitted data in the console. I created three checkboxes, the first one to mark the two below, and the other two regarding data processing. Is there a way to change the state of two checkboxes by clicking only the "Accept All" checkbox?

I found solutions that worked on checkboxes mapped from array, while my checkboxes are simply written in the code. I can't understand how I can target each of the two checkboxes that I need to make change in based on "Accept all" checkbox

Here is the snippet of code, I am using styled components.

import { useState } from 'react';

const Contact = () => {
  const [isChecked, setIsChecked] = useState(false);

  const handleOnChange = () => {
    setIsChecked(!isChecked);
  };

  return (
  <Processing>
    <Label>
      <Checkbox type='checkbox' />
      <CheckboxText>Accept all</CheckboxText>
    </Label>
    <Label>
      <Checkbox type='checkbox' defaultChecked={false} required />
      <CheckboxText>I agree to the processing my data</CheckboxText>
    </Label>
    <Label>
      <Checkbox type='checkbox' defaultChecked={false} required />
      <CheckboxText>RODO processing my data by company</CheckboxText>
    </Label>
  </Processing>
  );
};

export default Contact;




Aucun commentaire:

Enregistrer un commentaire