card这个组件其实主要也是负责渲染展示层面的,所以比价合适改写为functional component

export default{
    name:"metaCard",
    functional:true,
    props:{
        header: {},
        bodyStyle: {},
        shadow:{
            type:String,
            default:"always",
        },
    },
    render(h,{props,data,slots}){
        const slotsContent = slots();
        let header = null;
        if(slotsContent.header || props.header){
            header = (
                <div
                    class="el-card__header"
                >
                    {slotsContent.header || props.header}
                </div>
            );
        }

        return (
            <div
                class={['el-card',`is-${props.shadow}-shadow`]}
                {...data}
            >
                {header}
                <div
                    class="el-card__body"
                    style={props.bodyStyle}
                >
                    {slotsContent.default}
                </div>
            </div>
        );
    },
}

results matching ""

    No results matching ""