通过观察小米商城的头部导航栏的时候可以发现,它是由一个文字图标,和一个输入框,还有一个扫描二维码的按钮
有两种实现方式,一种是自己写一个自定义导航,还有一种是用官方的
这里使用官方的,实现去到pages.json文件,找到index这个页面配置
可以通过给它设置app-plus
app-plus是配置编译到 App 平台时的特定样式，部分常用配置 H5 平台也支持。以下仅列出常用，更多配置项参考 WebviewStyles。
它拥有这么多的配置项,这里仅仅介绍使用到的
首先配置一下搜索框,
配置代码如下
然后看看效果,
可以看到,搜索框是出来了,那现在还需要添加两个按钮
然后在titleNView对象下面,设置buttons选项,
图标因为前几章讲了如何获取,这里就不赘述了,
需要注意的就是,图标需要加上\u作为前缀,否则不显示
完成之后,效果如下
那么导航栏的搜索框就完成了
