详细介绍uniapp怎么设置全局页面

uniapp全局页面介绍

uniapp提供了一种全局页面的概念，这种页面无需在路由配置中声明，可以被其他页面直接访问，用于处理一下全局的操作或者展示。

如何设置全局页面？

我们可以在uniapp的主配置文件——manifest.json中进行全局页面的设置。

"globalStyle":{
  "navigationBarTitleText": "uniapp",
  "navigationBarTextStyle": "black",
  "navigationBarBackgroundColor": "#F6F7F8",
  "backgroundColor": "#F6F7F8"
},
"globalPages": {
  "page1": {
    "path": "pages/page1/page1",
    "style": {
      "navigationBarTitleText": "page1",
      "backgroundColor": "#fff"
    }
  },
  "page2": {
    "path": "pages/page2/page2",
    "style": {
      "navigationBarTitleText": "page2",
      "backgroundColor": "#F6F7F8"
    }
  }
}

在globalStyle属性下，我们可以设置一些全局样式，在globalPages中，我们可以声明多个全局页面，每个页面包含一个path和style属性，path属性用来指定页面路径，style属性用来设置页面样式，其中navigationBarTitleText用来设置页面标题，backgroundColor用来设置页面背景色等等。

如何访问全局页面？

我们可以使用this.\$globalRouter.push()方法来访问全局页面。

this.\$globalRouter.push({
  path: 'page1',
  query: {
    id: '123'
  }
})

其中的path属性指定了要访问的全局页面，query属性可以向目标页面中传递参数。

全局页面注意事项

1.全局页面一旦被声明，就会被预加载，所以不要声明过多的全局页面，以免影响应用性能；

2.使用this.\$globalRouter.push()方法访问全局页面时，只能访问已声明过的全局页面；

3.由于全局页面是无需在路由配置中声明的，所以不支持在路由守卫中使用。