javascript - 如何在组件内制作组件？

Question

<Modal>
    <Modal.Footer>
        // any custom content. User can completely control behavior of this content. 
    </Modal.Footer>
</Modal>

export const ModalFooter = ({children}) => {
     return <div className={'modal-footer'}>{children}</div>
}

.modal-footer {
    // css to make footer sticky or scrollable. 
}

场景是模态框的页脚将成为可选功能。仅当该人发送 时，才会出现。所以我想在模态组件内创建 。 有人可以告诉我如何实现这一目标吗？

Answer 1

像这样创建

const Modal = ({ children }) => <>{children}</>;

const ModalFooter = ({children}) => {
     return <div className={'modal-footer'}>{children}</div>
}

Modal.Footer = ModalFooter;
export default Modal;