Update wording

This commit is contained in:
Chalarangelo
2021-10-13 20:40:54 +03:00
parent a1d4f62042
commit b4dd74f868
18 changed files with 44 additions and 42 deletions

View File

@ -2,14 +2,14 @@
title: MultiselectCheckbox
tags: components,input,state,array,intermediate
firstSeen: 2019-01-27T09:25:57+02:00
lastUpdated: 2020-11-26T23:57:34+02:00
lastUpdated: 2021-10-13T19:29:39+02:00
---
Renders a checkbox list that uses a callback function to pass its selected value/values to the parent component.
- Use the `useState()` hook to create the `data` state variable and use the `options` prop to initialize its value.
- Create a `toggle` function that uses the spread operator (`...`) and `Array.prototype.splice()` to update the `data` state variable and call the `onChange` callback with any `checked` options.
- Use `Array.prototype.map()` to map the `data` state variable to individual `<input type="checkbox">` elements, each one wrapped in a `<label>`, binding the `onClick` handler to the `toggle` function.
- Use `Array.prototype.map()` to map the `data` state variable to individual `<input type="checkbox">` elements. Wrap each one in a `<label>`, binding the `onClick` handler to the `toggle` function.
```jsx
const MultiselectCheckbox = ({ options, onChange }) => {