1、成果展示 (菜單導航，及基於本地的數據增刪查改)

2、如何在釘釘開放平台創項目及項目創建完之后項目文件結構目錄講解

3、釘釘小程序頁面生命周期

4、釘釘小程序基礎語法基礎事件基礎JSAPI

5、釘釘開放平台之上架

1、成果展示 (菜單導航，及數據的增刪查改)

2、如何在釘釘開放平台創項目及項目創建完之后項目文件結構目錄講解

　　地址：https://open-dev.dingtalk.com/#/index

點擊創建即可創建小程序

登錄小程序開發者工具選擇自己創建的小程序打開即可

3、釘釘小程序頁面生命周期

Page()

Page() 接受一個 object 作為參數，該參數用來指定頁面的初始數據、生命周期函數、事件處理函數等。

//index.js

Page({
  data: {
    title: "Test"
  },
  onLoad(query) {
    // 頁面加載
  },
  onReady() {
    // 頁面加載完成
  },
  onShow() {
    // 頁面顯示
  },
  onHide() {
    // 頁面隱藏
  },
  onUnload() {
    // 頁面被關閉
  },
  onTitleClick() {
    // 標題被點擊
  },
  onPullDownRefresh() {
    // 頁面被下拉
  },
  onReachBottom() {
    // 頁面被拉到底部
  },
  onShareAppMessage() {
   // 返回自定義分享信息
  },
  viewTap() {
    // 事件處理
    this.setData({
      text: 'Set data for update.'
    })
  },
  go() {
    // 帶參數的跳轉，從 page/index 的 onLoad 函數的 query 中讀取 xx
    dd.navigateTo({url:'/page/index?xx=1'})
  },
  customData: {
    hi: 'Dingtalk'
  }
})

注意：基礎數據鈎子函數頁面自定義方法需要寫在一起

4、釘釘小程序基礎語法基礎事件基礎JSAPI

語言類似於vue。css支持網頁css寫法 js支持網頁js寫法支持ES6

a.采用聲明式渲染數據驅動模型

axml寫法格式基本和vue一樣，

如：1.v-if、v-for改成了a:if、a:for；
2.所有的數據寫在{{ }}中間
3.沒有v-bind雙向綁定功能

js就是普通js寫法，axml調用的數據放在data對象中，自定義方法也寫在page參數中，修改數據時需要調用this.setData()方法，使用數據時需要調用this.data。

acss配置自己的axml頁面樣式

a:for="{{tagArr}}" key="{{item}}"

class="inner-tag {{item.code==tagCode?'tag-active':''}}"

a:if='true'

跟vue不同的是小程序沒有a-bind f方法

內置有基礎方法

dd.showLoading()就是顯示個loading出來.
dd.httpRequest()就是發請求了.
dd.alert()是彈框,里面的content是彈框內容,buttonText是彈框提示語.

b.點擊事件傳參

<view class="right" data-address-id="{{item.userId}}" onTap="editAddress">
         <image mode="scaleToFill" src="/images/my/updateImg.png"/>
      </view>

//跳轉修改地址頁面  保存當前數據id
  editAddress(event){
    let _this = this;
    dd.setStorage({
           key: 'addressId',
           data: event.target.dataset.addressId,
          success: function() {
              my.navigateTo({ url: '../editAddress/editAddress' });
            }
       });
    },

c.發起異步請求

// Content-Type為application/json時，data參數只支持json字符串，用戶需要手動調用JSON.stringify進行序列化
dd.httpRequest({
  headers: {
    "Content-Type": "application/json"
  },
  url: 'http://httpbin.org/post',
  method: 'POST',
  // 需要手動調用JSON.stringify將數據進行序列化
  data: JSON.stringify({
    from: '釘釘',
    production: 'Dingtalk',
  }),
  dataType: 'json',
  success: function(res) {
    dd.alert({content: 'success'});
  },
  fail: function(res) {
    dd.alert({content: 'fail'});
  },
  complete: function(res) {
    dd.alert({content: 'complete'});
  }
});