小程序-测试项目

小程序测试项目目录结构

/icon    -- 图标等本地静态资源

../user.png

.....

/pages   -- 所有的页面,由于小程序每个页面由四个同名文件组成,每个页面建一个文件夹

../login

../../login.wxml

../../login.js

../../login.wxss

../../login.json

.....

/uitity   -- 公用脚本

../cache.js

.....

app.js

app.json

app.wxss

project.config.json

启动页面

在app.json的 pages数组第1个是启动页.希望动态指定启动页时可以到app.js的 onLaunch方法里写控制代码.

假设登录过的进入主页面,没登录过的进入登录页面

// 登录状态判断
if (cache.islogin() == true) {
  wx.reLaunch({
    url: 'pages/bance/bance'
  })
  // 由于pages数组的第1个是登录页.所以未登录时进入登录页
}

页面间传值

page1 中点击按钮跳到 page2

wx.navigateTo({
  url: '../page2/page2?id=1&name=mirror
})

在page2中onLoad方法获得URL上的参数

onLoad: function(options) {
  let id = options.id;
  let name=options.name;
}
// 如果是一个json,可将其转为字符串后放到url上.拿到之后再解析
let data = {id:1,name:"mirror"};
let json = JSON.stringify(data);
wx.navigateTo({
  url: '../page2/page2?jsonstr=' + json
})
 
onLoad: function(options) {
  let data = JSON.parse(jsonstr);
}

js模块化

如何制作项目中的公用类方法和函数.为其它文件引用

uitity.js 文件

// 帮助类

var tool = new function(){

  self = this;

  // 提供一个随机数  

  self.randNext = function(min,max){}

  // 提供时间格式化

  self.dateFmt = function(date){}

  ...

}

// 其它文件引用后可以使用其中的tool类,通过api这个变量.这个方法的作用类似于在C#方法前定义了public 小程序js模块,变量作用域在默认文件内

module.exports = {
  api:tool
}
 
user.js 引用uitity.js
var tool = require("../../uitity/uitity.js");
let randnum = api.tool.randNext(0,100);
 

猜你喜欢

转载自www.cnblogs.com/mirrortom/p/9297203.html
今日推荐