小程序全局样式 app.json

https://developers.weixin.qq.com/miniprogram/dev/reference/configuration

  1. {
  2.   # pages 配置页面地址
  3. "pages": [
  4.         path,
  5.     path
  6.  ],
  7. # 配置窗口
  8. "window": {
  10. },
  11. # 底部栏
  12. "tabBar": {
  14. }
  15. }

flex布局

  1. {
  2. display: flex,
  3. flex-direction:  row/column
  4.   justify-content: 主轴
  5.   align-items: 副轴
  6. }

页面跳转

对标签绑定事件

  1. # bindtap 绑定  myclick 函数,  传递了{name='xhb', password='123456'} 的参数
  2. <view bindtap="myclick"  data-name="xhb"  data-password="123456"> 点击 </view>
  1. myclick: function(e){
  2.   var name = e.currentTarget.dataset.name
  3.   console.log(name);
  4. }

页面跳转

  1. wx.navigateTo({
  2.  url: "..."
  3. })
  4. # 跳转的页面想要接收参数，可以在 onload 里接收

通过标签跳转

  1. <navigator url="...">点击跳转</navigator>

数据绑定

  1. # html
  2. # 通过{{ message }} 双向绑定数据
  3. <view>{{ message }} </message>
  5. # js
  6. data {
  7. "message": "这是一条信息"
  8. }

替换数据

  1. 通过bindtap 绑定 点击事件
  3. # 获取data 里 message 数据
  4. this.data.message 
  6. # 设置message 数据，改变数据
  7. this.setData({message: "改变message"})

获取用户信息

  1. getname: function(){
  2.         var that = this
  3.         // 微信获取用户信息接口
  4.         wx.getUserProfile({
  5.           desc: "获取用户信息",
  6.           success: res => {
  7.               var name = res.userInfo.nickName
  8.               var avatar = res.userInfo.avatarUrl
  9.               that.setData({
  10.                   "name": name,
  11.                   "avatar": avatar
  12.               })
  13.               console.log("success")
  14.           },
  15.           fail: res => {
  16.             console.log("fail", res)
  17.           }
  18.         })
  19.     }