本文—————小白/零基础/初中高级开发者适用
看了一下，目前网页搜索的关于navigation路由的情况很少且不全，我把所有情况进行一个总结吧，以备各路大佬使用。

为什么会出现白屏？

什么叫白屏？

举个常见的例子，当用户点击A页面中的Button，给Button添加点击事件，进行路由导航navigation去跳转到B页面，
理想情况： 应该是跳到B页面显示B页面中的内容
实际情况： 跳到B页面却不显示B页面内容，只显示白屏。

排查原因：

1.没有引入/配置路由表信息

需要在module.json5文件中进行配置
插入文本：

 "routerMap": "$profile:router_map",

这行代码真的很重要！你不加它就是白屏，多少老手都是写完就忘，找了半天发现代码哪哪都没问题，最后才发现是忘记引入routerMap了，一行代码的事，可以解决99%的问题和节约时间！
使用navigation路由的时候一定要养成良好的习惯——引入routerMap！！！

在项目中的位置图片如下：

同时需要在resources/base/profile目录下新建router_map.json文件，在router_map.json中配置路由表信息，注意是json文件，不能写注释，会报错！

2.在路由配置表中信息填写错误

需要：

匹配路由名称name是否一致

匹配pageSourceFile路径是否一致

匹配buildFunction信息是否一致

3.路由传输时名称有误

通过pushPathByName方法去传递路由，要注意第一个参数也就是name是否和router_map.json中的name属性一致

 Button() {
           Text('登录')
             .fontSize(20)
             .fontWeight(FontWeight.Bold)
         }.onClick(() => {
           this.pageInfos.pushPathByName('LoginOK', '')
         })

4.使用的是Preview预览器调试

navigation是官方推荐的路由导航，不支持预览器查看，建议真机调试或者模拟器调试。
老版本的router路由是支持预览器Preview调试的，但是由于官方不推荐了，所以咱们还是使用navigation吧。

5.NavBar处于隐藏状态

请确定当前NavBar是否处于隐藏状态，如果此时页面栈为空，页面表现上会处于白屏

6.跨模块跳转配置错误

路由表中的页面，比如说我们从Index.ets跳转到LoginOK.ets 页面，那么LoginOK.ets页面中需要配置入口函数Builder，并且需要使用NavDestination组件才能展示页面。

function LoginOKBuilder() {
  NavDestination(){//建议统一在Builder中使用NavDestination组件进行包裹。
    LoginOK()
  }.hideToolBar(true)

}
@Entry
@Component
struct LoginOK {
  build() {
    Row() {
   //此处存放代码
    }
    .height('100%')
  }
}

HAR/HSP模块可以跳转，可以通过module.json5文件查看type类型是否为“har”或者“shared”，如果是feature则会出现错误

"module": {
  "name": "feature_splash",
  "type": "feature",
  // type类型需要为: "har"或者"shared"