Skip to content
On this page

全局API: 通用

__dynamicImportComponent__()

该函数是一个编译函数,它的作用是将导入的组件编译为适用于特定平台的导入方式,并将其提供给路由表使用。在 uni-simple-router 中,所有的路由表组件都是通过该函数辅助导入的。

  • 类型

    ts
    type dynamicImportComponentRule  = (path:string,optios?:{
        pageType?:`top` | ''
        style?:Record<string,any>,
        package?:{
            type?:`main` | `child`,
            name?:string
        }
    }) => RouteRecordComponentRule
  • 详细

    • pageType 参数默认不传递时为 空字符串 表示当前导入的组件为子路由组件。当导入的组件为根路由组件时,必须设置 pageType:'top'

    • style 参数与 uni-app 下的 pages.json->pages->style 完全一致,当有设置该参数时,该页面会自动采用uni-app的配置,该参数在根路由组件中有效。

    • package 参数表示是否将该组件装入分包中,如果传递该参数,会自动根据 nametype 参数设置分包,分包配置你可以在 将导入的组件分包 中找到。

    • package.type 参数默认不传递时会将组件保留在主包中,即 package.type='main'。如果设置为 child 时会根据导入的路径进行分包。

    • package.name 参数默认不传递时会自动根据导入组件的第一个路径名设置为分包名。如果传递,会采用该参数名作为分包名。该参数仅在 package.type = 'child' 的情况下触发。

  • 示例

    js
    import {
      __dynamicImportComponent__
    } from '@/uni-simple-router'
    
    const IndexCom = __dynamicImportComponent__(`@/pages/index.vue`,{
      pageType:`top`
    })  
    
    const router = createRouter({
      routes:[{
          path:`/`,
          component:IndexCom,
      }]
    })
  • 参考 指南 - 路由组件指南 - 将导入的组件分包

全局API: 通用 has loaded