bilibili 小程序首页，提供微信桌面端访问首页由头部的搜索框选项卡切换页面以及可滚动的热门和追番区域构成为提升复用性，将页面中需重复使用的部分制作成组件首先，设计并创建了搜索框组件，引入iconfont中的图标资源，以实现美观且功能丰富的搜索功能针对搜索框组件，内部包含uniapp的基础组件。

uniapp的局部样式实现是以vue文件为单位的，在某个vue文件内定义的样式，只在该vue的渲染范围内生效尺寸响应式uniapp框架为了更好的适配不同的移动端屏幕，设置了750rpx为屏幕的基准宽度如果屏幕宽度小，rpx显示效果会等比缩小如果屏幕宽度大，rpx显示效果会等比例放大举例说明如果设计稿的元素。

在uniapp中，当设置navigationStyle为custom取消原生导航栏时，由于窗体为沉浸式，占据了状态栏位置此时可以通过在页面顶部放置一个高度为varstatusbarheight的view来避免页面内容出现在状态栏具体配置如下代码块页面配置quotpathquot quotpagesindexindexquot， quotstylequot quotappplusquot app。