小程序(二)

转载至https://www.cnblogs.com/xinchenhui/p/10409880.html

{
  "pages":[
    "pages/news/news",//在pages下添加news文件夹以及news文件夹下的一套页面
    "pages/news/child/child",//在news下添加child文件夹以及child文件夹下的一套页面
     "pages/news/child",//在news下添加child的一套页面
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#ccc",//导航栏的颜色
    "navigationBarTitleText": "小程序aaa",//导航栏的文字
    "navigationBarTextStyle":"black",//导航栏的文字颜色
     "enablePullDownRefresh":true//全局添加下拉刷新
  },
   "tabBar": {//底部导航栏:最少两个最多五个
     "position":"bottom",//底部导航栏位置,top在上面显示
     "list": [
       {
       "iconPath": "iconPath",//图标、路径
       "selectedIconPath": "iconPath",//选中后的图标、路径
       "pagePath": "pages/news/news",//文件路径
       "text": "新页面"//文字
       },
       {
       "iconPath": "iconPath",//图标、路径
       "selectedIconPath": "iconPath",//选中后的图标、路径
       "pagePath": "pages/index/index",
       "text": "首页"
       },
       {
       "iconPath": "iconPath",//图标、路径
       "selectedIconPath": "iconPath",//选中后的图标、路径
       "pagePath": "pages/logs/logs",
       "text": "日志"
       }
     ]
   },
}
复制代码

详细信息可以看文档:微信小程序app.json页面的官方配置文档

2、绑定事件:bindtap、catchtap。

bind开头的事件不会阻止事件冒泡,而catch开头的事件可以阻止事件冒泡。

<button bindtap='aaa'>按钮</button>
<button catchtap='aaa'>按钮</button>

3、跳转页面方法:wx.navigateTo({文件路径(例如:../news/news)});

复制代码
aaa:(e)=>{
  console.log(e);
  wx.navigateTo({//跳转页面方法,不会跳转tabbar页面
    //路径在这里
  });
  wx.switchTo({//跳转tabbar页面并关闭其他页面
    //路径在这里
  });
  wx.navigateBack({//返n个回页面
    //路径在这里
  });
},
复制代码

4、获取事件对象、传值

<button data-aid='001' bindtap='bbb'>按钮</button>
复制代码
bbb:(e)=>{
    console.log(e.target.dataset.aid);//触发事件的源组件(事件注册/绑定所在组件)
    console.log(e.currentTarget.dataset.aid);//事件触发的当前事件(当前事件,可能是触发事件的源组件,
      可能是触发的事件组件(即触发事件源组件的子元素),此时点击子元还是父元素,都是当前事件,应用e.currentTarget).
}
//view层无法用正常方式在小括号内传值,只能设置data-自定义属性,然后从事件对象内获取数据

//如果在modal层可以按正常方式传值!!!
复制代码

5、请求api接口

复制代码
wx.request({ 
  url: 'test.php', // 仅为示例,并非真实的接口地址
  data: {
    x: '', y: ''
  },
  header: {
    'content-type': 'application/json' // 默认值
  },
  success(res) {
    console.log(res.data)
  }
})
复制代码
原文地址:https://www.cnblogs.com/max-hou/p/11602198.html