微信小程序完整界面，钩子函数

Page({

Data: {
    Data: {
        Text: "this is page data"
    },onLoad: function(options) {
        // 页面加载时执行的初始化工作
    },onReady: functon() {
        // 页面就绪后触发执行的操作
    },onShow: function() {
        // 页面打开时，触发执行的操作
    },onHide: function() {
        // 页面隐藏时，触发执行的操作
    },onUnLoad: function() {
        // 页面关闭时触发执行的操作
    },viewTap: function() {
        // 事件函数，设置data中定义的变量 
        this.setData({
            text: "修改初始化定义的数据的值";
        });
    }
}

});

一个 page 的 生命 周期 从 onLoad 事件 开始， 整个 生命 周期 内 onLoad、 onReady、 onUnload 这 三个 事件 仅 执行 一次， 而 onHide 和 onShow 事件 在 每次 页面 隐藏 和 显示 时 都会 触发。 当 用户 手动 触发 左 上角 的 退出 箭头 时， 小 程序 仅 触发 app. onHide， 下次 进入 小 程序 时会 触发 app. onShow 以及 当前 page. onShow。 仅 当 小 程序 在后 台 运行 超过 一定 时间 未被 唤起、 或者 用户 手动 在 小 程序 的 控制 栏 里 点击 退出 程序、 或者 小 程序 内存 占用 过大 被 关闭 时， 小 程序 将被 销毁， 触发 app. onUnload 事件。

沾满这个屏幕地图的css
.mapView {
display: flex;
flex-direction: column;
}
.mapHeight {
flex: 1
}
/ 100vh能使得地图沾满屏幕 /
.map {
height: 100vh;
width: 100%;
}

html

、、、
Page({
data: {

// markers 标记点
// id: marker点击事件回调会返回此id。建议为每个marker设置上Number类型id，保证更新marker时有更好的性能。
// latitude: 纬度
// longitude: 经度
// iconPath: 项目目录下的图片路径，支持相对路径写法，以'/'开头则表示相对小程序根目录；也支持临时路径
markers: [],controls: [{
  id: 1,iconPath: '/resources/location.png',position: {
    left: 10,top: 400,width: 30,height: 30
  },clickable: true
}]

},
onLoad: function() {

this.mapContext = wx.createMapContext("map",this);

},
// 定义函数，这个函数获取地图中心位置坐标
getCenterLocation: function() {

// 获取当前位置
wx.getLocation({
    success: (res) => {
      console.log(res);
      // 打开地图，在地图中显示
      wx.openLocation({
        latitude: res.latitude,longitude: res.longitude,})
    }
  }),// 在地图中选择地址
  wx.chooseLocation({
    success: function(res) {
      console.log(res);
      this.setData({
        markers: [{
          iconPath: "/resources/user.png",id: 0,latitude: res.latitude,height: 30,alpha: 0.5,callout: {
            content: " 附近师傅33名 ",color: "#ffffff",fontSize: 10,borderRadius: 10,bgColor: "#6e707c",padding: 5,display: "ALWAYS"
          }
        }]
      })
    },})
  // this.mapContext.getCenterLocation({
  //   success: (res) => {
  //     console.log(res);
  //     this.setData({
  //       markers: [{
  //         iconPath: "/resources/user.png",//         id: 0,//         longitude: res.longitude,//         latitude: res.latitude,//         width: 30,//         height: 30,//         alpha: 0.5,//         callout: {
  //           content: " 附近师傅33名 ",//           color: "#ffffff",//           fontSize: 10,//           borderRadius: 10,//           bgColor: "#6e707c",//           padding: 5,//           display: "ALWAYS"
  //         }
  //       }]
  //     })
  //   }
  // })

},
regionchange(e) {

console.log(e.type)

},
markertap(e) {

console.log(e.markerId)

},
controltap(e) {

console.log(e.controlId)

}
})
、、、