微信小程序实现拍照并拿到图片对象功能

微信小程序提供了函数chooseImage

我们可以在wxml中定义一个按钮

html 复制代码
<view>
    <button bindtap="photograph">拍照</button>
</view>

这里绑定了一个点击事件 叫 photograph

然后 我们在js中编写代码如下

javascript 复制代码
//import { getAll } from "../../api/bookApi";
Page({
  data: {
  },
  onLoad() {
    
  },
  photograph() {
    wx.chooseImage({
      count: 1,
      sourceType: ['camera'],
      success: function (res) {
        console.log(res.tempFilePaths);
      },
      fail: function (res) {
        console.log(res.errMsg);
      }
    })
  },
 
})

这里 我们点击后调用了wx.chooseImage 回调中接受了一个res对象

其中的tempFilePaths字段就是我们要到图片集合

我们运行代码

然后用手机真机调试 然后按下这个拍照按钮

他就调用上了我们手机的拍照功能

然后我们在开发者工具中选择电脑本地的图片

res.tempFilePaths就会帮我们将图片的对象拿到

相关推荐
chaffererdog30 分钟前
uniapp开发微信小程序使用vk-uview-ui的uSearch搜索组件,在微信开发者工具中点击输入框会意外触发custom事件
微信小程序·小程序·uni-app
程序员鱼皮6 小时前
现在上线个小程序这么麻烦吗?!
微信小程序·程序员·aigc
2501_915918417 小时前
Flutter 加固方案全解析,从 Dart 层到 IPA 成品的多工具协同防护体系
flutter·macos·ios·小程序·uni-app·cocoa·iphone
我命由我123457 小时前
微信小程序 - 内容弹出框实现(Vant Weapp 实现、原生实现)
开发语言·前端·javascript·微信小程序·小程序·前端框架·js
小码哥0688 小时前
陪诊小程序核心功能拆解:预约、导航与提醒
小程序·项目源码·预约系统·陪诊·陪诊系统开发
q_19132846958 小时前
基于Springboot+uniapp的智慧停车场收费小程序
java·vue.js·spring boot·小程序·uni-app·毕业设计·计算机毕业设计
2501_916007478 小时前
深入理解 iOS 文件管理体系,从沙盒结构到多工具协同的工程化文件管理实践
android·ios·小程序·https·uni-app·iphone·webview
00后程序员张8 小时前
iOS 性能检测工具深度解析 多工具协同下的全维度性能检测体系建设
android·ios·小程序·https·uni-app·iphone·webview
说私域9 小时前
天猫卖家运营突围:基于开源AI智能名片链动2+1模式S2B2C商城小程序的转型路径研究
人工智能·小程序·开源
00后程序员张9 小时前
Fiddler调试工具全面解析 HTTPHTTPS抓包、代理设置与接口测试实战教程
前端·测试工具·ios·小程序·fiddler·uni-app·webview