import React from 'react'; import './index.less'; import CheckboxItem from '../CheckboxItem'; function AnswerCheckbox(props) { const { selected = [], answer = [], show, list = [], onChange } = props; // const trueList = []; const falseList = []; const map = {}; answer.forEach(row => { map[row] = true; }); selected.forEach(row => { if (!map[row]) falseList.push(row); }); return ( <div className="answer-checkbox"> {list.map((item) => { return ( <div className={`item ${answer.indexOf(item.value) >= 0 ? 'true' : ''} ${falseList.indexOf(item.value) >= 0 ? 'false' : ''} ${show ? 'show' : ''}`} onClick={() => { const index = selected.indexOf(item.value); if (index >= 0) { selected.splice(index, 1); } else { selected.push(item.value); } if (onChange) onChange(selected); }}> <CheckboxItem checked={selected.indexOf(item.value) >= 0} /> <div className="text">{item.label}</div> <div className="icon" /> </div> ); })} </div> ); } AnswerCheckbox.propTypes = {}; export default AnswerCheckbox;