[Fragman]

Выглядит это следующим образом:

import React from 'react';
import Item from '../cardEleme/Item';

class CardList extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            cards: [
                { id: '1', header: 'Первая карточка', checked: false },
                { id: '2', header: 'Вторая карточка', checked: false },
                { id: '3', header: 'Третья карточка', checked: false },
                { id: '4', header: 'Четвертая карточка', checked: false },
                { id: '5', header: 'Пятая карточка', checked: false },
            ],
        };
    }

    showChecked = (props) => {
        let num = Number(props);
        num--;
        let cards = [...this.state.cards];
        if (this.state.cards[num].checked) {
            cards[num] = { ...cards[num], checked: false };
        } else {
            cards[num] = { ...cards[num], checked: true };
        }
        this.setState({ cards });
    };

    removeCards = () => {
        let cards = this.state.cards.filter((card) => !card.checked);
        this.setState({ cards });
    };

    render() {
        return (
            <div>
                <div>
                    {this.state.cards.map((card) => (
                        <Item {...card} readOnly={this.props.readOnly} key={card.id} showCheck={this.showCheck} />
                    ))}
                </div>

                <button style={{ marginLeft: '25px', marginTop: '15px' }} onClick={this.removeCards}>
                    Удалить
                </button>
            </div>
        );
    }
}
export default CardList;

А ошибка:"Cannot read property 'checked' of undefined". Мне кажется, что это всё как-раз таки из-за неправильной индексации