回复 刷新

暂无评论

记录微信小程序中遇到的问题

一、页面窗口表现配置

每一个小程序页面也可以使用同名.json文件来对本页面的窗口表现进行配置,页面中配置项会覆盖app.json的window中相同的配置项。

问题: 页面样式未生效
原因: 未将页面路径添加到app.json的pages数组中
解决:

1、要将pages目录下所有页面的路径,添加到app.json的pages数组中。

{ "pages":[ "pages/index/index", "pages/profile/profile" ], "window":{ // 全局默认的窗口表现 "backgroundTextStyle":"light", "navigationBarBackgroundColor": "#ff0000", "navigationBarTitleText": "语言学习", "navigationBarTextStyle":"white" },

2、页面配置:

在页面对应的.json文件中,配置与窗口有关的属性,将aap.json的window属性中相同的配置项覆盖。下面是与页面导航栏相关的属性:

{ "navigationBarBackgroundColor": "#ffffff", "navigationBarTextStyle": "black", // 导航栏标题颜色,仅支持 black/white,默认white "navigationBarTitleText": "微信接口功能演示", "navigationStyle": "#eeeeee" // 导航栏样式,仅支持以下值:default默认样式,custom自定义导航栏,只保留右上角胶囊按钮 }

二、自定义页面导航栏

在页面配置文件中将导航栏样式配置为自定义, “navigationStyle”: “custom”
问题: 自定义的返回按钮,点击无法跳转到index页面,但是可以跳转到其他页面。
原因: 是因为在tabBar(app.json)中已经将index页面配置为tab对应的页面所导致的。
解决:

有两种实现跳转的方式,对应的解决方法:

方式一、wxml文件:

<navigator style="margin: 20px;" url="/pages/index/index">go back</navigator>

默认:open-type=“navigate”
添加:open-type=“switchTab”

方式二、js文件:

`wx.navigateTo({ url: '/pages/index/index' })`

用wx.switchTab()替换掉wx.navigateTo()即可。

  • 59
  • 0
  • 0