vue3+ts+element 从新封装el-link 修改默认参数 以及跳转路由使用vueRouter跳转 以及常用路径封装

注释已经写好了 如果哪里有问题 或者写法不对 请指教 谢谢

<script lang="ts">
import { defineComponent, h } from 'vue'
import { ElLink } from 'element-plus'
import { Router, useRouter } from 'vue-router'

type ElLinkDefaultPropsKey = Array<'type' | 'underline' | 'disabled' | 'href' | 'icon'>
// 参数
const ElLinkDefaultProps: ElLinkDefaultPropsKey = ['type', 'underline', 'disabled', 'href', 'icon']
//常用跳转格式
const toMap = (): Map<string, any> =>
    new Map([
        [
            'login',
            {
                path: '/user/login',
                query: '',
                param: '',
            },
        ],
        [
            'test',
            {
                path: '/tstt',
            },
        ],
    ])
const componetn = defineComponent({
    name: 'ElLink',
    props: {
        //自带参数
        ...ElLink.props,
        // 修改默认参数
        underline: {
            type: Boolean,
            default: false,
        },
        href: {
            type: String,
            default: '#',
        },
        // 自定义参数
        // 是否在新窗口打开
        openInNewWindow: {
            type: Boolean,
            default: false,
        },
        //router name
        name: {
            type: String,
            default: '',
        },
        // router query
        query: {
            type: Object,
            default: () => ({}),
        },
        // router parms
        parmas: {
            type: Object,
            default: () => ({}),
        },
        // 是否记录路由
        isRecordRouter: {
            type: Boolean,
            default: false,
        },
        // 返回上一级页面
        go: {
            type: Number,
            default: 0,
        },
        //常用路由封装
        to: {
            type: String,
            default: '',
        },
    },
    setup(props, { slots }) {
        //路由
        const router: Router = useRouter()
        //跳页面
        const toPage = (): boolean => {
            const { openInNewWindow, href, name, query, params, isRecordRouter, go, to } = props
            // 返回上一级页面
            if (go !== 0) {
                router.go(go)
                return false
            }
            //是否在新窗口中打开
            if (openInNewWindow) {
                return true
            }
            // 传递参数
            let routeData = { query: query }
            if (href) {
                // 如果 href 路由存在
                routeData['path'] = href
            } else if (name) {
                // 如果 name 存在
                routeData['name'] = name
                routeData['params'] = params
            } else if (to) {
                // 自定义路由跳转
                routeData = toMap().get(to)
            }
            if (isRecordRouter) {
                // 不记录路由
                router.replace(routeData)
            } else {
                // 记录路由
                router.push(routeData)
            }
            return false
        }
        //获取指定props
        const getProps = () => {
            const propsData = {}
            // 组件属性
            ElLinkDefaultProps.forEach(item => {
                propsData[item] = props[item]
            })
            //自设属性
            if (props.openInNewWindow) {
                propsData['target'] = '_blank'
            }
            return propsData
        }
        return {
            toPage,
            getProps,
        }
    },
    render(_ctx: any) {
        return h(
            ElLink,
            {
                ..._ctx.getProps(),
                onclick: _ctx.toPage,
            },
            _ctx.$slots
        )
    },
})
export default componetn
</script>