在React中，可以使用组合（composition）的方式将两个或多个组件嵌入到一个组件中。组合是一种用于构建可重用和灵活的组件的强大技术。
有几种方式可以实现组件的嵌入：
- 使用组件作为子元素：通过将一个或多个组件作为子元素传递给父组件，使得这些组件可以在父组件的渲染过程中被嵌入和展示。
function ParentComponent({ children }) { return ( <div> <h1>Parent Component</h1> {children} </div> ); } function ChildComponent1() { return <p>Child Component 1</p>; } function ChildComponent2() { return <p>Child Component 2</p>; } function App() { return ( <ParentComponent> <ChildComponent1 /> <ChildComponent2 /> </ParentComponent> ); }
2.使用组件作为属性：通过将一个或多个组件作为属性传递给父组件，使得这些组件可以在父组件的渲染过程中被嵌入和展示。
function ParentComponent({ child1, child2 }) { return ( <div> <h1>Parent Component</h1> {child1} {child2} </div> ); } function ChildComponent1() { return <p>Child Component 1</p>; } function ChildComponent2() { return <p>Child Component 2</p>; } function App() { return ( <ParentComponent child1={<ChildComponent1 />} child2={<ChildComponent2 />} /> ); }
