微信小程序記錄 - api

 

 

wx.canIUse(string schema)	當前版本是否可用	返回值 boolean
wx.switchTab({ url: '/index' })	跳轉到 tabBar 頁面，並關閉其他所有非 tabBar 頁面
wx.reLaunch({ url: 'test?id=1' })	關閉所有頁面，打開到應用內的某個頁面
wx.redirectTo({ url: 'test?id=1' })	關閉當前頁面，跳轉到應用內的某個頁面。但是不允許跳轉到 tabbar 頁面。
wx.navigateTo({ url: 'test?id=1' })	保留當前頁面，跳轉到應用內的某個頁面。但是不能跳到 tabbar 頁面。使用 wx.navigateBack 可以返回到原頁面。小程序中頁面棧最多十層。
Page({ onLoad(option) { console.log(option.query) } })	獲取路由參數
wx.navigateBack({ delta: 2 })	關閉當前頁面，返回上一頁面或多級頁面。可通過 getCurrentPages 獲取當前的頁面棧，決定需要返回幾層。
wx.showToast({ title: '成功', icon: 'success', duration: 2000 })	顯示消息提示框
wx.showModal({ title: '提示', content: '這是一個模態彈窗', success(res) { if (res.confirm) { console.log('用戶點擊確定') } else if (res.cancel) { console.log('用戶點擊取消') } } })	顯示模態對話框
wx.showLoading({ title: '加載中', }) setTimeout(function () { wx.hideLoading() }, 2000)	等待框
wx.showActionSheet({ itemList: ['A', 'B', 'C'], success(res) { console.log(res.tapIndex) }, fail(res) { console.log(res.errMsg) } })	操作菜單
wx.hideToast(Object object)	隱藏消息提示框
wx.hideLoading(Object object)	隱藏 loading 提示框
Page({ onPullDownRefresh() { wx.stopPullDownRefresh() } })	下拉刷新
wx.startPullDownRefresh()	停止下拉刷新

 

wx.pageScrollTo({ scrollTop: 0, duration: 300 })	將頁面滾動到目標位置
wx.createAnimation(Object object)	創建一個動畫實例 animation。調用實例的方法來描述動畫。最後通過動畫實例的 export 方法導出動畫數據傳遞給組件的 animation 屬性。	duration（ms） timingFunction (linear)(ease)(ease-in) ('ease-out') delay transformOrigin
Animation.export()	導出動畫隊列。export 方法每次調用後會清掉之前的動畫操作。
Animation.step(Object object)	表示一組動畫完成。可以在一組動畫中調用任意多個動畫方法，一組動畫中的所有動畫會同時開始，一組動畫完成後纔會進行下一組動畫。
Animation.opacity(number value)	設置透明度
Animation.width(number|string value)	設置寬度

 

<view
  animation="{{animationData}}"
  style="background:red;height:100rpx;width:100rpx"
></view>

例子：
Page({
  data: {
    animationData: {}
  },
  onShow() {
    const animation = wx.createAnimation({
      duration: 1000,
      timingFunction: 'ease',
    })
    this.animation = animation
    animation.scale(2, 2).rotate(45).step()
    this.setData({
      animationData: animation.export()
    })
})

wx.nextTick(function callback)

延遲一部分操作到下一個時間片再執行。（類似於 setTimeout）

Component({
  doSth() {
    this.setData({number: 1}) // 直接在當前同步流程中執行

    wx.nextTick(() => {
      this.setData({number: 3}) // 在當前同步流程結束後，下一個時間片執行
    })

    this.setData({number: 2}) // 直接在當前同步流程中執行
  }
})

wx.onWindowResize (function callback)	監聽窗口尺寸變化事件監聽窗口尺寸變化事件
wx.offWindowResize(function callback)	取消監聽窗口尺寸變化事件

wx.request(Object object)

發起請求

wx.request({
  url: 'test.php', // 僅爲示例，並非真實的接口地址
  data: {
    x: '',
    y: ''
  },
  header: {
    'content-type': 'application/json' // 默認值
  },
  success(res) {
    console.log(res.data)
  }
})

RequestTask.abort()

中斷請求任務

 

const requestTask = wx.request({
  url: 'test.php', // 僅爲示例，並非真實的接口地址
  data: {
    x: '',
    y: ''
  },
  header: {
    'content-type': 'application/json'
  },
  success(res) {
    console.log(res.data)
  }
})
requestTask.abort() // 取消請求任務

 

wx.downloadFile(Object object)

下載文件資源到本地。客戶端直接發起一個 HTTPS GET 請求，返回文件的本地臨時路徑

wx.downloadFile({
  url: 'https://example.com/audio/123', // 僅爲示例，並非真實的資源
  success(res) {
    // 只要服務器有響應數據，就會把響應內容寫入文件並進入 success 回調，業務需要自行判斷是否下載到了想要的內容
    if (res.statusCode === 200) {
      wx.playVoice({
        filePath: res.tempFilePath
      })
    }
  }
})

DownloadTask

一個可以監聽下載進度變化事件，以及取消下載任務的對象

const downloadTask = wx.downloadFile({
  url: 'http://example.com/audio/123', // 僅爲示例，並非真實的資源
  success(res) {
    wx.playVoice({
      filePath: res.tempFilePath
    })
  }
})

downloadTask.onProgressUpdate((res) => {
  console.log('下載進度', res.progress)
  console.log('已經下載的數據長度', res.totalBytesWritten)
  console.log('預期需要下載的數據總長度', res.totalBytesExpectedToWrite)
})

downloadTask.abort() // 取消下載任務

wx.uploadFile(Object object)

將本地資源上傳到服務器。客戶端發起一個 HTTPS POST 請求，其中 content-type 爲 multipart/form-data。使用前請注意閱讀相關說明。

wx.chooseImage({
  success(res) {
    const tempFilePaths = res.tempFilePaths
    wx.uploadFile({
      url: 'https://example.weixin.qq.com/upload', // 僅爲示例，非真實的接口地址
      filePath: tempFilePaths[0],
      name: 'file',
      formData: {
        user: 'test'
      },
      success(res) {
        const data = res.data
        // do something
      }
    })
  }
})

UploadTask

一個可以監聽上傳進度變化事件，以及取消上傳任務的對象

const uploadTask = wx.uploadFile({
  url: 'http://example.weixin.qq.com/upload', // 僅爲示例，非真實的接口地址
  filePath: tempFilePaths[0],
  name: 'file',
  formData: {
    user: 'test'
  },
  success(res) {
    const data = res.data
    // do something
  }
})

uploadTask.onProgressUpdate((res) => {
  console.log('上傳進度', res.progress)
  console.log('已經上傳的數據長度', res.totalBytesSent)
  console.log('預期需要上傳的數據總長度', res.totalBytesExpectedToSend)
})

uploadTask.abort() // 取消上傳任務

sync:同步

wx.setStorageSync(string key, any data)

wx.setStorage(string key, any data)

wx.setStorage({
  key: 'key',
  data: 'value'
})

try {
  wx.setStorageSync('key', 'value')
} catch (e) { }

wx.removeStorageSync(string key)

wx.removeStorage(string key)

wx.removeStorage({
  key: 'key',
  success(res) {
    console.log(res)
  }
})

try {
  wx.removeStorageSync('key')
} catch (e) {
  // Do something when catch error
}

wx.getStorageSync(string key)

wx.getStorage(Object object)

wx.getStorage({
  key: 'key',
  success(res) {
    console.log(res.data)
  }
})
try {
  const value = wx.getStorageSync('key')
  if (value) {
    // Do something with return value
  }
} catch (e) {
  // Do something when catch error
}

 

Object wx.getStorageInfoSync()

Object wx.getStorageInfo()

wx.getStorageInfo({
  success(res) {
    console.log(res.keys)
    console.log(res.currentSize)
    console.log(res.limitSize)
  }
})

try {
  const res = wx.getStorageInfoSync()
  console.log(res.keys)
  console.log(res.currentSize)
  console.log(res.limitSize)
} catch (e) {
  // Do something when catch error
}

wx.clearStorage(Object object)

wx.clearStorage()
清理本地數據緩存

try {
  wx.clearStorageSync()
} catch (e) {
  // Do something when catch error
}

上拉加載： onReachBottom