Question

当我打开三个小孩A中的一个打开时，如果他们打开，我想关闭另外两个孩子。

Answer 1

使用道具来处理每个孩子的开放状态。将open={false}传递给其他两个孩子，然后将open={true}传递给您要打开的孩子。如果没有任何代码示例，很难给出有意义的答案。

Answer 2

它的要点是

// where openChild is just the index of the child that should be open
// fetched from redux
// you should use an id here instead of an index
const Parent = ({ openChild }) => {
    return [0, 1, 2].map((index) => (
        <Child key={index} index={index} closed={openChild !== index}/>
    ))
}

const Child = ({ index, closed }) => {
    return <div className={closed ? 'closed' : 'open'}>{index}</div>
}

对孩子使用.open和.closed来控制是否正在显示它，或者您可以有条件地渲染整个事情

const Parent = ({ openChild }) => {
    return [0, 1, 2].map((index) => (
        openChild !== index 
            ? <Child key={index} index={index} />
            : null
    )).filter(child => !!child)
    /* you don't really need the above line */
}

如何关闭其他组件的子项？

2 个答案: