import React, { useState, useEffect } from 'react'; import { Checkbox, Empty } from 'antd'; import styles from './checkBox.less'; const CheckList = props => { const { info, valueCallback, nodeType } = props; const [list, setList] = useState([]); const [flag, setFlag] = useState(false); console.log(info, 'info'); useEffect(() => { if (info.pageUrl) { let arr = [...info.relatedRoleList]; let arr2 = []; arr.map(item => { if (item.related) { arr2.push(item.relatedRoleCode); } }); setList(arr); setFlag(true); } return () => { setFlag(false); }; }, [info]); const handleSelect = (e, val) => { let arr = []; list.forEach(item => { if (item.relatedRoleCode === val) { item.related = e.target.checked; } }); setList([...list]); valueCallback(list); }; return ( <div> {nodeType === 1 ? ( <div className={styles.box}> {/* <Checkbox>全选/反选</Checkbox> */} {list && list.length > 0 && list.map(item => ( <div key={item.relatedRoleCode} className={styles.check} title={item.relatedRoleName} > <Checkbox checked={item.related} onChange={e => { handleSelect(e, item.relatedRoleCode); }} > {item.relatedRoleName} </Checkbox> </div> ))} </div> ) : ( <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} /> )} </div> ); }; export default CheckList;