小编kou*_*ami的帖子

我正在尝试创建一个Autocomplete实质上仅向用户显示搜索结果的 Material UI 组件。某些选项的名称可能会重复，但它们都有唯一的 ID。我收到以下警告：

\n

index.js:1 警告：遇到两个具有相同键的子项，Name B。密钥应该是唯一的，以便组件在更新时保持其身份。非唯一的键可能会导致子项重复和/或省略 \xe2\x80\x94 该行为不受支持，并且可能在未来版本中更改。

\n

const SearchField = () => {\n    const [open, setOpen] = React.useState(false)\n    const [searchQuery, setSearchQuery] = React.useState('')\n    const [searchResults, setSearchResults] = React.useState([])\n    const loading = true //later\n\n    const debounced = useDebouncedCallback(\n        async searchQuery => {\n            if (searchQuery) {\n                let result = await doSearch(searchQuery)\n                if (result.status === 200) {\n                    setSearchResults(result.data)\n                } else {\n                    console.error(result)\n                }\n            }\n        },\n        1000\n    )\n\n    const handleInputChange = e => …

我有一组数据将用于创建手风琴，我想让它一次只能展开其中一个（即，如果用户展开手风琴 #1，然后展开 #2，#1 将取消展开）

我有这个代码：

const MyAccordion = props => {
    const [expanded, setExpanded] = React.useState()
    const handleChange = panel => (_, isExpanded) => {setExpanded(isExpanded ? panel : false)}
    const classes = styles //?
    let accordionInfo = createAccordionInfo(props.propthing);
    return (
        <Accordion
            key={accordionInfo.uid}
            onChange={handleChange(accordionInfo.uid)}
            expanded={expanded === accordionInfo.uid}
            TransitionProps={{unmountOnExit: true}}
            className={classes.accordion}
        >
            <AccordionSummary expandIcon={<ExpandMoreIcon />} aria-controls={`${accordionInfo.uid}-content`} id={`${accordionInfo.uid}-header`}>
                <Typography>Accordion Summary</Typography>
            </AccordionSummary>

            <AccordionDetails>
                <Typography>Accordion Details</Typography>
            </AccordionDetails>
        </Accordion>
    )
}

const MyAccordions = props => {
    const [expanded, setExpanded] = React.useState()
    const handleChange = panel …