javascript - Preact.js 如何创建分层组件

Question

我想创建一个组件作为生成 HTML 容器的父级，以及一些其他组件作为子级。例如我有这样的 CardComponent

import { h, Component } from "preact"

    class CardComponent extends Component{
        render(){
            return (
                <div className='card'>

                </div>
            )
        }
    }

假设我们有 ButtonComponent import { h, Component } from "preact"

class ButtonComponent extends Component{
    render(){
        return (
            <button>
              a button
            </button>
        )
    }
}

然后我想像这样调用这些组件

<CardComponent>
    <ButtonComponent/>
</CardComponent>

我该怎么办CardComponent？

标签： javascriptpreact

Answer 1

试着做：

import { h, Component } from "preact"

    class CardComponent extends Component{
        render(){
            return (
                <div className='card'>
                  {this.props.children}
                </div>
            )
        }
    }