Vue vs React vs Angular vs Svelte Part.9

[245 デフォルトの名無しさん 2022/01/29(土) 09:43:05.22 ID:7vtiEs09]

renderは分けたほうがいいよ

const useChecks = (labels: string[]) => {
const [checkList, setCheckList] = useState(labels.map(x=>false));
const handleCheck = useCallback((index: number) => {
setCheckList((checks) => checks.map((c, i) => (i === index ? !c : c))) }, []);
return {
labels, checkList, onCheck: handleCheck,
isAllChecked: checkList.every(x=>x) }

const App = () => {
const checks = useChecks(["a", "b", "c"]);
return <div>
<Checks {...checks} />
<button disabled={!checks.isAllChecked}>next</button>
</div>
}