I'm relatively new to React and Material UI and I'm trying to build a table with a list of names of candidates and a column to select these candidates and pass these values to another table. Howvever, I keep getting props.action is not a function in my handleChange function?
My class's constructor
class AssignExaminer extends React.Component {
constructor(props) {
super(props)
this.handleCheck = this.handleCheck.bind(this);
this.state = {
candidate: dummyCandidate,
checkedValues: []
};
handleCheck(e, x) {
this.setState(state => ({
checkedValues: state.checkedValues.includes(x)
? state.checkedValues.filter(c => c !== x)
: [...state.checkedValues, x]
}));
}
My table
<TableBody>
{(this.state.candidate).map((candidate) => (
<TableRow>
<TableCell>
{candidate.name}
</TableCell>
<TableCell>
<Checkbox onChange={e => this.handleCheck(e, candidate.name)}
checked={this.state.checkedValues.includes(candidate.name)} />
</TableCell>
</TableRow>
))}
</TableBody>
My checkbox class
export default function CheckboxLabels(props) {
const handleChange = (event) => {
props.action(event);
};
return(
<>
<StyledCheckbox checked={props.checked} onChange={handleChange}/>
{props.name}
</>
);
}
Aucun commentaire:
Enregistrer un commentaire