Как я могу сделать так, чтобы мой флажок возвращал значение True при проверке?

Question

        interface SearchProps {
    getGroup: (check?: boolean) => void;
    saveFunc: () => void;
}
    const [state, setState] = useState({ checked: false })
        const handleCheckboxChange = () => {
            setState({ ...state,  checked: !state.checked })        
        }

    const searchGroup = () => {
        props.spinnerOn();
        props.getGroup(state.checked);
    }

        return props.show ? ReactDOM.createPortal((

                        <FormControlLabel
                            control={<Checkbox checked={state.checked} onChange={handleCheckboxChange} name="SG" />}
                            label="SG" labelPlacement="top"
                        />
    }

    const mapStateToProps = (state: ApplicationState) => {
        return {
            results: state.results
        }
    }

    const mapDispatchToProps = (dispatch: any) => {
        return {
            getGroup: (check? : boolean) =>
                dispatch(actionTypes.getGroup(check))
        }
    }

    export default connect(mapStateToProps, mapDispatchToProps)(SearchGroup);

В настоящее время, когда я пытаюсь выполнить поиск, возвращенный URL-адрес проверил, возвращая «undefined» вместо «true», если отмечен, и «false», если не отмечен

Не уверен, что мне не хватает?

Answer 1

Код, который вы скопировали, является совершенно неправильным в зависимости от квадратных скобок и т. Д., Должно быть, это просто проблема с копированием, но вот пример флажка, который может вам помочь. Я только что сделал это для вас, дайте мне знать, если у вас есть какие-либо вопросы.

import React, {useState} from 'react';

const Checkbox = (props) => {
    const [checked, setChecked] = useState(false);
    return (
        <input type={"checkbox"} checked={checked} onChange={(event) => setChecked(event.target.checked)} />
    )
}

export default Checkbox;