Update and housekeeping
This commit is contained in:
@ -1,14 +1,14 @@
|
||||
---
|
||||
title: MultiselectCheckbox
|
||||
title: MultiselectCheckbox
|
||||
tags: input,state,array,intermediate
|
||||
---
|
||||
|
||||
Renders a checkbox list that uses a callback function to pass its selected value/values to the parent component.
|
||||
|
||||
* Use `React.setState()` to create a `data` state variable and set its initial value equal to the `options` prop.
|
||||
* Create a function `toggle` that is used to toggle the `checked` to update the `data` state variable and call the `onChange` callback passed via the component's props.
|
||||
* Render a `<ul>` element and use `Array.prototype.map()` to map the `data` state variable to individual `<li>` elements with `<input>` elements as their children.
|
||||
* Each `<input>` element has the `type='checkbox'` attribute and is marked as `readOnly`, as its click events are handled by the parent `<li>` element's `onClick` handler.
|
||||
- Use `React.setState()` to create a `data` state variable and set its initial value equal to the `options` prop.
|
||||
- Create a function `toggle` that is used to toggle the `checked` to update the `data` state variable and call the `onChange` callback passed via the component's props.
|
||||
- Render a `<ul>` element and use `Array.prototype.map()` to map the `data` state variable to individual `<li>` elements with `<input>` elements as their children.
|
||||
- Each `<input>` element has the `type='checkbox'` attribute and is marked as `readOnly`, as its click events are handled by the parent `<li>` element's `onClick` handler.
|
||||
|
||||
```jsx
|
||||
const style = {
|
||||
|
||||
Reference in New Issue
Block a user