注册小程序和页面

Author: coderwhy

app.js

@@ -0,0 +1,38 @@
+// 注册一个小程序示例
+App({
+  // 小程序初始化完成时
+  onLaunch: function (options) {
+    // 获取用户信息
+    console.log(options)
+  },
+  // 小程序显示出来时
+  onShow: function (options) {
+    // 1.判断小程序的进入场景
+    console.log(options)
+    switch(options.scene) {
+      case 1001:
+        break;
+      case 1005:
+        break;
+    }
+
+    // 2.获取用户的信息, 并且获取到用户信息之后, 将用户的信息传递给服务器
+    wx.getUserInfo({
+      success: function(res) {
+        console.log(res)
+      }
+    })
+  },
+  // 小程序隐藏时
+  onHide: function () {
+    
+  },
+  // 小程序产生一些错误
+  onError: function (msg) {
+    
+  },
+  globalData: {
+    name: 'coderwhy',
+    age: 18
+  }
+})

pages/home/home.js

@@ -1,66 +1,70 @@
 // pages/home/home.js
-Page({
+// getApp()获取App()产生的示例对象
+// const app = getApp()
 
-  /**
-   * 页面的初始数据
-   */
-  data: {
+// const name = app.globalData.name;
+// const age = app.globalData.age;
 
+// 注册一个页面
+// 页面也有自己的生命周期函数
+Page({
+  // ------------ 2.初始化数据 -------------------
+  data: {
+    message: '哈哈哈',
+    list: []
   },
 
-  /**
-   * 生命周期函数--监听页面加载
-   */
-  onLoad: function (options) {
-
+  // ------------ 1.监听页面的生命周期函数 -------------------
+  // 页面被加载出来
+  onLoad() {
+    console.log('onLoad')
+    const _this = this;
+    wx.request({
+      url: 'http://123.207.32.32:8000/recommend',
+      // 箭头函数中的this一层层向上找
+      success: function(res) {
+        console.log(res)
+        const data = res.data.data.list;
+        _this.setData({
+          list: data
+        })
+      }
+    })
   },
-
-  /**
-   * 生命周期函数--监听页面初次渲染完成
-   */
-  onReady: function () {
-
+  // 页面显示出来时
+  onShow() {
+    console.log('onShow')
   },
-
-  /**
-   * 生命周期函数--监听页面显示
-   */
-  onShow: function () {
-
+  // 页面初次渲染完成时
+  onReady() {
+    console.log('onReady')
   },
-
-  /**
-   * 生命周期函数--监听页面隐藏
-   */
-  onHide: function () {
-
+  // 当页面隐藏起来时
+  onHide() {
+    console.log('onHide')
   },
-
-  /**
-   * 生命周期函数--监听页面卸载
-   */
-  onUnload: function () {
-
+  onUnload() {
+    console.log('onUnload')
   },
 
-  /**
-   * 页面相关事件处理函数--监听用户下拉动作
-   */
-  onPullDownRefresh: function () {
-
+  // ------------ 3.监听wxml中相关的一些事件 -------------------
+  handleGetUserInfo(event) {
+    console.log(event)
   },
-
-  /**
-   * 页面上拉触底事件的处理函数
-   */
-  onReachBottom: function () {
-
+  handleViewClick() {
+    console.log('哈哈哈被点击了')
   },
 
-  /**
-   * 用户点击右上角分享
-   */
-  onShareAppMessage: function () {
-
+  // ------------ 4.其他事件 -------------------
+  // 监听页面的滚动
+  onPageScroll(obj) {
+    // console.log(obj)
+  },
+  // 监听页面滚动到顶部
+  onReachBottom() {
+    console.log('页面滚动到顶部')
+  },
+  onPullDownRefresh() {
+    console.log('下拉刷新的事件')
   }
-})
+})

pages/home/home.json

@@ -1,3 +1,4 @@
 {
-  "usingComponents": {}
+  "usingComponents": {},
+  "enablePullDownRefresh": true
 }

pages/home/home.wxml

@@ -1,3 +1,18 @@
 <!--pages/home/home.wxml-->
 <text class='title'>Hello World</text>
 <button size='mini'>按钮</button>
+
+<!-- 2.获取用户信息的方式 -->
+<button size='mini' 
+        open-type='getUserInfo'
+        bindgetuserinfo='handleGetUserInfo'>
+  获取授权
+</button>
+
+<!-- 3.展示用户信息的方法 -->
+<open-data type="userNickName"></open-data>
+<open-data type="userAvatarUrl"></open-data>
+
+<view bindtap='handleViewClick'>{{message}}</view>
+
+<view wx:for="{{list}}">{{item.title}}</view>

project.config.json

@@ -4,12 +4,13 @@
 		"ignore": []
 	},
 	"setting": {
-		"urlCheck": true,
+		"urlCheck": false,
 		"es6": true,
 		"postcss": true,
 		"minified": true,
 		"newFeature": true,
-		"autoAudits": false
+		"autoAudits": false,
+		"checkInvalidKey": true
 	},
 	"compileType": "miniprogram",
 	"libVersion": "2.7.1",