ReactJS - getAttribute return null

Question

I have a problem with getAttribute() in my React code.

const handleChange = (event) => {
        let selectM = event.target.getAttribute("data-minister_name");
        console.log(selectM);
    };

<List dense sx={{ width: '100%', maxWidth: 360, bgcolor: 'background.paper' }}>
                        {listMiniters.map((c) => (
                            <ListItem
                                key={c.label}
                                disablePadding
                                onClick={handleChange}
                                data-minister_name="{c.label}"
                            >
                                <ListItemButton>
                                    <ListItemAvatar>
                                        <Avatar
                                            alt={`Avatar n°${c.label + 1}`}
                                            src={`https://flagcdn.com/w20/${c.code.toLowerCase()}.png`}
                                        />
                                    </ListItemAvatar>
                                    <ListItemText id={c.label} primary={`Line item ${c.label + 1}`} />
                                </ListItemButton>
                            </ListItem>
                        ))}
                    </List>

It return to my

null

I don't understand where come from the problem...? Could you help my please ?

I'm using MUI.

Answer 1

Please try without '_' in your attribute name.

Altrernatively try with e.target.attributes.getNamedItem("aatribute-name").value;