微信小程序开发(一) 动态修改页面标题
来源:互联网 发布:sql查询语句不重复 编辑:程序博客网 时间:2024/05/16 19:26
为提高微信小程序的用户体验,原则上设计页面时,页面顶部标题应随内容不同进行修改。
微信小程序固定架构
- pages
- example
- example.js
- example.json
- example.wxml
- example.wxss
- example
- utils
- app.js
- app.json
- app.wxss
微信小程序默认架构中存在全局设置文件app.json,用以设置跳转页面链接、窗体格式、TabBar以及网络超时等。
页面标题有两种需求存在:页面功能固定(如:设置功能、个人信息展示功能),该类页面可采用在功能页面配置.json文件的形式;另一类需求为页面内容与业务关联性比较强,需要从数据库中获取数据后方可确定页面标题,该类页面需在功能页面加载时采用动态设置的方式。
1. 页面标题内容固定
1.1示例:
//页面标题代码在example.json文件中的书写格式{ "navigationBarTitleText": "充值业务"}
1.2示图:
2. 随数据库返回内容动态更新页面标题
//example.js加载时动态设置页面标题//获取应用实例var app = getApp();Page({ data: {}, onLoad: function (options) { var that = this; that.setData({ mername: options.mername//options为页面路由过程中传递的参数 }) wx.setNavigationBarTitle({ title: that.data.mername//页面标题为路由参数 }) }, onReady: function () { // 页面渲染完成 }, onShow: function () { // 页面显示 }, onHide: function () { // 页面隐藏 }, onUnload: function () { // 页面关闭 }})
14 0
- 微信小程序开发(一) 动态修改页面标题
- 微信小程序动态修改页面标题setNavigationBarTitle
- js动态修改页面标题
- c#2.0中动态修改页面标题
- c#2.0中动态修改页面标题
- 微信小程序例子——动态设置页面标题
- 微信小程序三(设置页面标题)
- asp.net 2.0中动态修改页面标题
- asp.net 2.0中动态修改页面标题
- asp.net 2.0中动态修改页面标题
- asp.net2.0中动态修改页面标题
- asp.net 2.0中动态修改页面标题
- 动态修改页面标题,关键字及描述等信息
- asp.net 2.0中动态修改页面标题
- 修改页面标题
- MFC对话框型程序动态修改自身标题
- 微信小程序之三(设置页面标题)
- 动态修改TabLayout标题
- Oracle基础
- Oracle
- js中遍历的语法
- @RequestBody @ResponseBody 详解
- Flex基础
- 微信小程序开发(一) 动态修改页面标题
- Flex模块化(module)
- 一些Flex知识
- 题目1035:找出直系亲属
- Flex拖动
- orcale 部分闪回
- Flex弹出窗口
- macOS Sierra中使用VMware Fusion安装centos7
- 采用的架构 BlazeDS + Spring + Hibernate