How to write Render function in SFC?

Question

I'm trying to pass a SFC component as a parameter, and then render in somewhere. In my case, It actually is creating a menu based on routes which provide "icon" field.

here is the routes:

import { AppRouteRecordRaw } from '../types';
import AddSvgIconVue from "@/components/icons/AddSvgIcon.vue";

const routes: AppRouteRecordRaw[] = [
  {
    path: '/admin',
    meta: {
      hideInMenu: true
    },
    component: () => import("@/pages/admin/index.vue"),
    children: [
      {
        path: 'userManagement',
        meta: {
          icon: AddSvgIconVue,
          title: '用户管理'
        },
        component: () => import("@/pages/admin/SubPages/UserManagement/index.vue")
      },
      {
        path: 'userManagement2',
        meta: {
          icon: AddSvgIconVue,
          hideInMenu: false,
          title: '用户'
        },
        component: () => import("@/pages/admin/SubPages/UserManagement/index.vue"),
        
      }
    ]

  },
]

export default routes;

And Here is the Menu Component. and the question is I want to know how should I convert the TSX component to SFC correctlly?