如何用另一个 React 组件替换一个 React 组件？

Question

I got something like this

<Box>
   <SomethingA>
</Box

I want to replace Box.SomethingA to Box.SomethingB

<Box>
   <SomethingB>
</Box>

How I can do it?

Answer 1

I am guessing you want to replace it after an event has occurred, for ex: button click . You can try this:

function App(){
  const [box, changeBox] = useState(true)

  return(
    <div>
      <button onClick={()=>{changeBox(!box)}} >Click</button>
      <Box>
        { box ? <SomethingA/> : <SomethingB/>}
      </Box>
    </div>
  )
}