0
votes

Exécutez un événement lorsque vous cochez une case à cocher

Je souhaite créer une application où, Ehen, je vais cliquer sur une case à cocher pour le désactiver. Donc, si je clique sur la première case à cocher pour désactiver le premier et ainsi de suite. Pour cela, j'ai fait:

function onChange(checkedValues) {
  console.log("checked = ", checkedValues);
}
const disabled = false;

const check = e => {
  console.log(e.target.disabled);
  let a = e.target.disabled;
  return disabled === true;
};

ReactDOM.render(
  <Checkbox.Group style={{ width: "100%" }} onChange={onChange}>
    <Row>
      <Col span={8}>
        <Checkbox disabled={disabled} onChange={check} value="A">
          A
        </Checkbox>
      </Col>
      <Col span={8}>
        <Checkbox value="B">B</Checkbox>
      </Col>
      <Col span={8}>
        <Checkbox value="C">C</Checkbox>
      </Col>
    </Row>
  </Checkbox.Group>,
  document.getElementById("container")

javascript reactjs

0 commentaires

3 Réponses :

1
votes

Utilisez E.CurrentTarget comme fonctionner dans cet exemple de vanille-JS (votre fonction de contrôle est fondamentalement la même que dans la vanille):

<input type="checkbox" value="a" />A <br />
<input type="checkbox" value="b" />B <br />
<input type="checkbox" value="c" />C <br />

0 commentaires

0
votes

Quelque chose comme ça fonctionnerait: https: // codesandbox .io / s / utilisation-with-grid-ant-design-demo-ucpgr

Donc de résumer:

composant personnalisé pour vérifier si la case à cocher actuelle est cochée, si oui, puis désactivez-la
stocker l'état dans un contexte, nous n'avons donc pas besoin de le transmettre via les accessoires à chaque fois

0 commentaires

1
votes

Utilisez un tableau pour mapper et stocker le statut désactivé irait bien.

xxx

Démo:

Entrez la description de l'image ici

1 commentaires

Pourriez-vous jeter un oeil s'il vous plaît, merci: Stackoverflow.com/questions/63345237/... , ce sera très utile