It is not successful for vuejs&iview to use the render function to render the custom component. How to solve this problem?

iview official website Code:

 render: (h, params) => {
                            return h("div", [
                                h("Button", {
                                    props: {
                                        type: "primary",
                                        size: "small"
                                    },
                                    style: {
                                        marginRight: "5px"
                                    },
                                    on: {
                                        click: () => {
                                            this.show(params.index)
                                        }
                                    }
                                }, "View"),
                                h("Button", {
                                    props: {
                                        type: "error",
                                        size: "small"
                                    },
                                    on: {
                                        click: () => {
                                            this.remove(params.index)
                                        }
                                    }
                                }, "Delete")
                            ]);
                        }
                    }

I registered a component: QiDropdown, and introduced it into components, but rendering error:

import QiDropdown from "@/components/QiDropdown"

export default {
    components:{
        QiDropdown
    },
...
render:(h,params)=>{
                        if(params.row.callout){
                            return h("div",params.row.callout);
                        }else{
                            return h("QiDropdown")
                        }
                    }
...

QiDropdown.vue component code:

<style lang="postcss" scoped>
.qi-dropdown{

}
</style>
<template>
<section class="qi-dropdown">
    <Dropdown>
        <a href="javascript：void(0)">
            
            <Icon type="arrow-down-b"></Icon>
        </a>
        <DropdownMenu slot="list">
            <DropdownItem></DropdownItem>
            <DropdownItem></DropdownItem>
            <DropdownItem disabled></DropdownItem>
            <DropdownItem></DropdownItem>
            <DropdownItem divided></DropdownItem>
        </DropdownMenu>
    </Dropdown>
</section>
</template>
<script>
export default {
    data(){
        return{
            
        }
    }
}
</script>