fix(multiselectcheckbox): lint with semistandard, minor changes
change const to function, update useState function name, and lint with semistandard
This commit is contained in:
@ -7,21 +7,21 @@ Initially, all the items in the `options` array only have label ( and / or other
|
|||||||
An `onChange` prop can be passed to the `MultiCheckbox` component to get the updated list on every change event within the list.
|
An `onChange` prop can be passed to the `MultiCheckbox` component to get the updated list on every change event within the list.
|
||||||
|
|
||||||
```jsx
|
```jsx
|
||||||
import React, { useState } from "react";
|
import React from 'react';
|
||||||
|
|
||||||
const style = {
|
const style = {
|
||||||
listContainer: {
|
listContainer: {
|
||||||
listStyle: "none",
|
listStyle: 'none',
|
||||||
paddingLeft: 0
|
paddingLeft: 0
|
||||||
},
|
},
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
cursor: "pointer",
|
cursor: 'pointer',
|
||||||
padding: 5
|
padding: 5
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const MultiCheckbox = ({ options, onChange }) => {
|
export default function MultiCheckbox ({ options, onChange }) {
|
||||||
const [data, updateOptions] = useState(options);
|
const [data, setData] = React.useState(options);
|
||||||
|
|
||||||
function toggle (item) {
|
function toggle (item) {
|
||||||
data.map((_, key) => {
|
data.map((_, key) => {
|
||||||
@ -29,7 +29,7 @@ const MultiCheckbox = ({ options, onChange }) => {
|
|||||||
data[key].checked = !item.checked;
|
data[key].checked = !item.checked;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
updateOptions([...data]);
|
setData([...data]);
|
||||||
onChange(data);
|
onChange(data);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -42,16 +42,14 @@ const MultiCheckbox = ({ options, onChange }) => {
|
|||||||
style={style.itemStyle}
|
style={style.itemStyle}
|
||||||
onClick={() => toggle(item)}
|
onClick={() => toggle(item)}
|
||||||
>
|
>
|
||||||
<input readOnly type="checkbox" checked={item.checked || false} />
|
<input readOnly type='checkbox' checked={item.checked || false} />
|
||||||
{item.label}
|
{item.label}
|
||||||
</li>
|
</li>
|
||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
</ul>
|
</ul>
|
||||||
);
|
);
|
||||||
};
|
}
|
||||||
|
|
||||||
export default MultiCheckbox;
|
|
||||||
```
|
```
|
||||||
|
|
||||||
```jsx
|
```jsx
|
||||||
|
|||||||
Reference in New Issue
Block a user