小程序常用API（项目）

最新推荐文章于 2024-07-01 15:47:43 发布
原创 最新推荐文章于 2024-07-01 15:47:43 发布 · 699 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#小程序

本文详细介绍了微信小程序中常用API的使用，包括更新Json数据、网络请求、加载、事件处理、页面跳转、对话框、错误处理、获取用户信息、打开附件和文档等，并提供了相关API的使用示例和应用场景。

1. 更新Json数据

var self = this
self.setData({
  hasLogin: true 
})       
that.update()

 

2. 网络请求

wx.request({
    url: '',
    data: {},
    method: 'GET',
    header: { 'content-type': 'application/json' },
    success: function (res) {
        var datas= res.data
    },
    fail: function () {},
    complete: function () {}
})

 

3. 加载

//显示加载框

wx.showLoading({
  title: '加载中', 
})

 //隐藏加载框 
wx.hideLoading()

 

4. bindtap点击事件传值

data-tag自定义参数传参

<text data-tag="{{item.tag}}" id="{{item.tag}}" bindtap='checkPage'>{{item.value}}</text>

//实现

checkPage: function(event) {
    var newTagId = event.target.id;
    var tag = event.target.dataset.tag;
    console.log("newTagId = " + newTagId)
    console.log("tag = " + tag)
}

5. 跳转

wx.navigateTo({
    url: './addresume/addresume?name=' + name + '&openId=' + openId,
})

wx.navigateTo({
    url: '../welfare/addresume/addresume',
})

PS：注意url 两者的文件位置关系，以上两种写法都可达到目的

拓展分析：‘./’ 为当前目录下 ‘…/’则为当前目录的上级目录 ,’/'则为当前目录的下的某个目录

pages/welfare/welfare.js

pages/welfare/addresume/addresume.js

 

6. toast

wx.showToast({ 
    title: '复制成功', duration: 1500, 
})

7. 对话框

wx.showModal({
    title: '复制该链接',
    content: '完成后请手动打开浏览器，是否继续？' + link,    
    success: function (res) {
    if (res.confirm) {
        wx.setClipboardData({
            data: link,
            success: function () {
            wx.showToast({
                title: '复制成功',
                duration: 1500,
            })
        },
            fail: function () {
                wx.showToast({
                title: '复制失败',
                icon: 'none',
                duration: 500,
             })
          }
       })
    } else if (res.cancel) {
        wx.showToast({
        title: '取消复制',
        icon: 'none',
        duration: 500,
        })
    }
  }
})

8. try catch

try {
 //在这里运行代码 
  抛出错误 
} catch(err) { 
 //在这里处理错误 
 console.log(err)
}

9. 获取用户信息

https://developers.weixin.qq.com/miniprogram/dev/api/open-api/user-info/wx.getUserInfo.html

 

 

10. 打开附件

wx.downloadFile({ //下载附件

    url: 'https://www.sz800800.cn/ZENGXING/0109...18.16.docx',

    fileType:'docx',

    success: function (res) {

    console.log(res)

    var filePath = res.tempFilePath

    wx.openDocument({ //打开附件

        filePath: filePath,

        success: function (res) {

            console.log(res)

        },

        complete:function(e){

            console.log(e)

        }

     })

    }

 })

}

11. 打开文档

wx.showLoading({

    title: '正在加载中...',

})

wx.downloadFile({

    url: item.downLoadUrl,

    success: function(res) {
        
    const filePath = res.tempFilePath

    wx.openDocument({

    filePath: filePath,

    success: function(res) {

        wx.hideLoading()()

     }

  })

 }

})

---------------

常用API

wx.canIUse(string schema)

判断小程序的API、回调、参数、组件等是否在当前版本可用

 

wx.getSystemInfoSync() | wx.getSystemInfo()

获取系统信息

 

wx.getLaunchOptionsSync()

获取小程序启动时的参数

 

属性

path：启动小程序的路径

scene：启动小程序的场景值

query：启动小程序的query参数

shareTicket：转发信息

referrerInfo：来源信息

应用级事件

wx.onPageNotFound(function callback) | App.onPageNotFound(function callback)

监听小程序要打开的页面不存在事件

 

属性

path：不存在页面的路径

query：不存在也秒的query参数

isEntryPage：时候本次启动的首个页面

wx.onError(function callback)

监听小程序错误事件

 

wx.onAudioInterruptionEnd(function callback)

监听音视频中断结束事件

 

wx.onAudioInterruptionBegin(function callback)

监听音频因系统占用而被中断开始事件（闹钟、电话、语音聊天、视频聊天等）

 

wx.onAppShow(function callback) | App.onShow(function callback)

监听小程序切前台事件

 

属性

path：小程序切前台的路径

scene： 小程序切前台的场景值

query：小程序切前台的query参数

ShareTicket：转发信息

referrerInfo：来源信息

wx.onAppHide | App.onHide

监听小程序切后台事件

 

wx.offPageNotFound(function callback) | wx.offError(function callback) | wx.offAudioInterruptionEnd(function callBack) | wx.offAudioInterruptionBegin(function callBack) | wx.offAppShow(function callBack) | wx.offAppHide(function callBack)

取消监听事件

 

定时器

clearInterval(interavalID)

取消setInterval设置的定时器

 

clearTimeout(timeoutID)

取消setTimeout 设置的定时器

 

setInterval(callback,number delay, any rest)

设置Interval定时器

 

setTimeout(callback,number delay, any rest)

设置timeout定时器

 

路由

wx.switchTab(object) I wx.reLaunch(object) | wx…redirect(object) | wx.navigateTo(object) | wx.navigateBack(object)

页面路由

 

参数：

url: 需要跳转的页面路径

success：调用成功的回调函数

fail：调用失败的回调函数

complete: 调用结束的回调函数

界面相关

wx.showToast(object) | wx.hideToast(object)

显示消息框

 

参数

title: 提示的内容

icon: 图标

image: 自定义图标的本地路径，优先级高于icon

duration: 提示的延迟时间

mask: 是否显示透明蒙层

success: 调用成功的回调函数

fail: 调用失败的回调函数

complete: 接口调用结束的回调函数

wx.showModal(object)

显示模态对话框

 

参数：

title: 提示的标题

content: 提示的内容

showCancel: 是否显示取消按钮

cancelText: 取消按钮文字

cancelColor: 取消按钮文字颜色

confirmTextL 确认按钮的文字

confirmColor: 确认按钮的文字颜色

success: 接口调用成功的回调函数

fail: 接口调用失败的回调函数

complete: 接口调用结束的回调函数

wx.showLoading(object) | wx.hideLoading(object)

显示loading提示框

 

参数

title: 提示的内容

mask: 是否显示透明蒙层

success： 接口调用成功的回调函数

fail: 接口调用失败的回调函数

complete： 接口调用结束的回调函数

wx.pageScrollTo(Object)

将页面滚动到目标位置

 

参数

scrollTop: 滚动到页面的目标位置

duration: 滚动动画的时长

success： 接口调用成功的回调函数

fail: 接口调用失败的回调函数

complete： 接口调用结束的回调函数

网络相关

wx,request(object)

发起网络请求

 

参数

url: 服务器接口地址

data: 请求参数

header: 设置请求的header

method：HTTP请求方法

dataType: 返回的数据格式

responseType:响应的数据类型

success： 接口调用成功的回调函数

fail:接口调用失败的回调函数

complete: 接口调用结束的回调函数

wx.downloadFile(object)

下载文件资源到本地

 

参数

url：下载资源的url

header：HTTP请求的Header

filePath： 指定文件下载后存储的路径

success： 接口调用成功的回调函数

fail: 接口调用失败的回调函数

complete：接口调用结束的回调函数

wx.uploadFile(object)

将本地资源上传到服务器

 

参数

url： 开发者服务器地址

filePath: 要上传文件资源的路径

name: 文件对应的key

header： HTTP请求的Header

formData: HTTP请求中其他额外的form data

success： 接口调用成功的回调函数

fail: 接口调用失败的回调函数

complete： 接口调用结束的回调函数

wx.connectSocket(object)

创建一个WebSocket连接

 

属性

url: 服务器wss接口地址

header: HTTP Header

protocols： 子协议数组

tcpNoDelay: 建立TCP 连接的时候的TCP_NODELAY设置

success： 接口调用成功的回调函数

fail： 接口调用失败的回调函数

complete： 接口调用结束的回调函数

wx.closeSocket(object)

关闭WebSocket 连接

 

参数

code: 连接状态号

reason：表示连接被关闭的原因

success：接口调用成功的回调函数

fail： 接口调用失败的回调函数

complete： 接口调用结束的回调函数

wx.onSocketMessage(function) | wx.onSocketError(object) | wx.onSocketClose(object) | wx.onSocketOpen(object)

监听webSocket 相关事件

 

 

小白如何在微信小程序中使用常用的API
吃不胖.
07-06 1177
下载微信开发者工具：根据自己的操作系统，下载对应的微信开发者工具，下载地址：https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html。注册小程序账号：访问微信小程序官网，点击“注册”按钮，根据提示填写相关信息注册小程序账号，注册地址：https://mp.weixin.qq.com/创建新的小程序项目：在微信开发者工具中，点击“新建小程序”按钮，填写项目名称和项目目录，选择合适的模板，并点击“创建”按钮。
【微信小程序】常用API-动态设置tabBar
最新发布
墨夶的博客
11-25 1986
tabBartabBartabBartabBar通过使用微信小程序提供的自定义tabBar功能，开发者可以灵活地控制每个用户的导航体验。希望本文能够帮助你在微信小程序开发中更好地利用这些API，打造更加友好和响应的应用程序。
微信小程序 --- 微信原生 API
每天都要努力学习哦~~
02-23 3315
小程序中也能够像网页一样支持本地数据缓存，本地数据缓存是小程序存储在当前设备上硬盘上的数据，本地数据缓存有非常多的用途，我们可以利用本地数据缓存来存储用户在小程序上产生的操作，在用户关闭小程序重新打开时可以恢复之前的状态。其包含以下 8个主要的 API。但一般我们在开发阶段时，处于开发阶段的服务器接口可能还没部署到对应的域名下，经常会通过另一个域名来进行开发调试，考虑到这一点，为了方便开发者进行开发调试，开发者工具、小程序的开发版和小程序的体验版在某些情况下允许。
微信小程序中常见API
qq_74472152的博客
06-27 1678
1.界面API： wx.navigateTo：在当前页面打开新页面，新页面可以返回到原页面。 wx.redirectTo：关闭当前页面，打开新页面。 wx.reLaunch：关闭所有页面，打开新页面。 wx.switchTab：跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面。 wx.navigateBack：关闭当前页面，返回上一页面。 wx.setNavigationBarTitle：动态设置当前页面的标题。 wx.setNavigationBarColor：设置导航栏颜
使用es6封装常用的小程序api
12-14
资源使用es6封装了常用的小程序api,在使用的同时可帮助没用过es6的用户快速上手箭头函数
小程序api（常用）
m0_51024444的博客
11-14 3031
wx.setNavigationBarTitle标题栏文本。wx.setNavigationBarColor标题颜色。wx.chooseMedia 选择图片或者视频。wx.getUserProfile获取用户信息。wx.chooseImage 从相册选择图片。wx.downloadFile下载文件。wx.showLoading 加载提示。wx.uploadFile上传。wx.showModal模态框。wx.showToast提示。success 回调函数。
小程序常用api
qq_25524173的博客
12-04 500
1.发请求：uni.request({ url: “https://www.uinav.com/api/public/v1/home/catitems”, }); 2：显示加载框：uni.showLoading；隐藏加载框：uni.hideLoading() 3.配置下拉刷新：enablePullDownRefresh：true 4.监听下拉：在里面重新发请求onPullDownRefresh()。 5.监听页面滚动：onPageScroll(e) 6.点击回到顶部：goTop() {uni.pageScr
精选资源
追书小说神器，微信小程序，内置API
05-04
6. **缓存机制**：为了提高用户体验，小程序可能会采用本地缓存策略，将常用或已阅读过的小说内容存储在本地，减少对网络的依赖，加快加载速度。 7. **搜索算法**：内置的搜索功能可能涉及到关键词匹配、模糊查询等...
微信小程序入门与实战 常用组件API开发技巧项目实战
03-16
微信小程序入门与实战 常用组件API开发技巧项目实战
微信小程序vant引用 及api封装
08-13
5. **api 封装**: 微信小程序的 API 通常可以直接在 JavaScript 文件中调用，但为了提高代码的可复用性和可维护性，你可以将常用或复杂的 API 进行封装。例如，创建一个 `api.js` 文件，封装网络请求： ```...
小程序API介绍及常用API 网络请求、loading、消息提示框、本地存储、路由与通信、上下拉加载刷新、scroll-view等
weixin_44166849的博客
07-01 520
小程序开发框架提供丰富的微信原生API，可以方便的调起微信提供的能力，例如：获取用户信息、微信登录、 微信支付等，小程序提供的API几乎都挂载在wx对象下，例如：wx.request()、wx.setStorage()等， wx对象实际上就是小程序的宿主环境微信提供的全局对象 小程序API介绍及常用API网络请求、loading、消息提示框、本地存储、路由与通信、上下拉加载刷新、scroll-view等
小程序-常用API
Android小码家
09-19 2516
网络请求 wx.request({ url: '', data: {}, method: 'GET', header: { 'content-type': 'application/json' }, success: function (res) { var datas= res.data }, ...
小程序之常用API
richest_qi的博客
07-14 536
文章目录wx.chooseImage()wx.chooseAddress()wx.makePhoneCall() wx.chooseImage() 从本地相册选择图片或使用相机拍照。 部分配置参数如下： count，最多可以选择的图片张数，是一个数值，默认值是9。 sizeType，所选图片的尺寸，是一个数组，默认值是['original','compressed']。 original，使用原图 compressed，使用压缩图 sourceType，选择图片的来源，是一个数组，默认值是['alb
微信小程序常用API
sdgjah2的博客
11-14 3405
该事件与 App.onUnhandledRejection 的回调时机与参数一致。wx.onPageNotFound(function listener) 监听小程序要打开的页面不存在事件。该事件与 App.onPageNotFound 的回调时机一致。wx.onError(function listener) 监听小程序错误事件。该事件与 App.onError 的回调时机与参数一致。该事件与 App.onThemeChange 的回调时机一致。该事件与 App.onShow 的回调参数一致。
小程序常用的 API 以及简单交互
Kofe_Chen的博客
09-15 915
微信开发者工具常用的API WXML 框架设计的一套标签语言，结合基础组件、事件系统，可以构建出页面的结构。 <view> >> <div> <text> >> <span> <navigator> >> <a> 数据绑定：使用 Mustache 语法（双大括号）将变量包起来 wxml &l...
3.小程序常用API总结
早日成为鹏总
03-09 304
1.加载 //显示加载框 wx.showLoading({ title: '加载中', }) //隐藏加载框 wx.hideLoading() 2.Toast wx.showToast({ 　　title: '功能暂未开放！', 　　icon: 'none', success 　　duration: 2000 }) 3.延时 setTimeout(function () { 　　wx.hideLoading() }, 2000) 4.数据缓存 //1.设置缓存 w.
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值