小程序常用api

发布于:2025-07-20 ⋅ 阅读:(15) ⋅ 点赞:(0)

1. wx.request - 发起网络请求

用于向服务器发送 HTTP 请求,获取数据或提交表单。

// 示例:GET 请求获取数据
wx.request({
  url: 'https://api.example.com/data', // 替换为实际 API 地址
  method: 'GET',
  success: (res) => {
    console.log('请求成功', res.data);
  },
  fail: (err) => {
    console.error('请求失败', err);
  }
});

2. wx.showToast - 显示提示消息

显示一个轻量级的提示框,常用于操作反馈。

// 示例:显示成功提示
wx.showToast({
  title: '操作成功!',
  icon: 'success',
  duration: 2000 // 显示时长(毫秒)
});

3. wx.getStorage - 获取本地缓存数据

从本地存储中读取数据,适合保存用户偏好设置。

// 示例:获取名为 'token' 的缓存数据
wx.getStorage({
  key: 'token',
  success: (res) => {
    console.log('获取缓存成功', res.data);
  },
  fail: (err) => {
    console.error('获取缓存失败', err);
  }
});

4. wx.navigateTo - 页面跳转

跳转到新页面,保留当前页面在栈中。

// 示例:跳转到 'pages/detail/detail' 页面
wx.navigateTo({
  url: '/pages/detail/detail' // 页面路径
});

5. wx.login - 用户登录

获取用户登录凭证(code),用于后端换取 openid。

// 示例:调用登录接口
wx.login({
  success: (res) => {
    if (res.code) {
      console.log('登录凭证:', res.code);
      // 通常这里发送 code 到后端服务器
    } else {
      console.error('登录失败');
    }
  }
});

6. wx.chooseImage - 选择图片

从相册或相机选择图片,常用于上传功能。

// 示例:选择一张图片
wx.chooseImage({
  count: 1, // 最多选择数量
  sizeType: ['original', 'compressed'], // 图片类型
  sourceType: ['album', 'camera'], // 来源
  success: (res) => {
    console.log('选择的图片路径:', res.tempFilePaths[0]);
  }
});

7. wx.showModal - 显示模态对话框

弹出对话框,用于确认操作或提示信息。

// 示例:显示确认对话框
wx.showModal({
  title: '提示',
  content: '确定要删除吗?',
  success: (res) => {
    if (res.confirm) {
      console.log('用户点击确定');
    } else if (res.cancel) {
      console.log('用户点击取消');
    }
  }
});

8. wx.getLocation - 获取地理位置

获取用户当前位置信息,需用户授权。

// 示例:获取经纬度
wx.getLocation({
  type: 'wgs84', // 坐标类型
  success: (res) => {
    console.log('纬度:', res.latitude, '经度:', res.longitude);
  },
  fail: (err) => {
    console.error('获取位置失败', err);
  }
});

使用建议

  • 代码集成:将以上代码复制到小程序的 .js 文件(如 app.js 或页面脚本)中即可运行。
  • 权限处理:部分 API(如 wx.getLocation)需要在小程序配置文件中声明权限(在 app.json 中添加 "permission": { "scope.userLocation": { "desc": "你的位置信息将用于定位" } })。
  • 错误处理:始终添加 fail 回调处理异常。
  • 官方文档:更多 API 详见微信小程序官方文档,确保代码兼容最新版本。

网站公告

今日签到

点亮在社区的每一天
去签到