-- 创造无限可能

微信小程序自定义顶部导航栏搜索框

2023-11-30 14:58:54
1435 人浏览 0 人点赞
有用，点赞支持一下

微信小程序自定义顶部导航栏搜索框（非组件）

一、隐藏原生navigationBar

  1. 全局自定义顶部导航栏
    在app.json的“window”里添加”navigationStyle”: “custom”

    "window": {
 "navigationStyle": "custom"
}

  2. 单独页面自定义顶部导航栏
    在该页面的json文件里添加”navigationStyle”: “custom”

    {
"usingComponents":{},
"navigationStyle": "custom"
}

二、获取系统及按钮信息,详细写法，请参考：https://blog.csdn.net/YN2000609/article/details/134212825

  1. js页面
    获取系统信息并计算按钮位置信息

  2. wxml页面
    通过获取的数据编写搜索框

  3. css页面
    美化搜索框

  4. app.js页面

相关文章