当前位置: 首页 > web >正文

React Native打开相册选择图片或拍照 -- react-native-image-picker

官方文档:https://www.npmjs.com/package/react-native-image-picker

场景:点击按钮打开相册选择图片或者点击按钮拍照

import { launchCamera, launchImageLibrary } from 'react-native-image-picker';// ...
<TouchableOpacityactiveOpacity={0.7}onPress={async() => {// 调相册选择图片const { assets } = await launchImageLibrary({mediaType: 'photo',quality: 1,includeBase64: false, // 是否要返回base64selectionLimit: 2 // 选择个数})if (!assets?.length) {return}console.log(assets[0])setPhotoImg(assets[0].uri) // uri可以用Image显示// 或者调摄像头拍照//     const { assets } = await launchCamera({//         mediaType: 'photo',//         cameraType: 'back',//         quality: 1,//         includeBase64: false,//         saveToPhotos: false // 是否保存到相册//     })//    if (!assets?.length) {//         return//     }//     console.log(assets[0])//     setPhotoImg(assets[0].uri)}}><Text>选择图片</Text></TouchableOpacity>

选中图片assets[0]结构:
在这里插入图片描述
注意:选中的图片如果要显示在页面,用返回值中的uri

<Imagestyle={{width: 160, height: 160}} source={{uri: photoImg}}
/>
http://www.xdnf.cn/news/15709.html

相关文章:

  • 腾讯云服务上下载docker以及使用Rabbitmq的流程
  • C++进阶-AVL树(平衡二叉查找树)(难度较高)
  • 深入理解CSS定位:绝对定位的包含块机制
  • 破解本地数据库困局:DbGate+内网穿透如何实现远程管理自由
  • Agent的深度解析:从原理到实践
  • docker更换国内加速器-更换华为加速器2025-717亲测可用docker 拉取镜像出错
  • 大模型Agent应用开发实战:从框架选型到行业落地
  • 【WPF】WPF 自定义控件之依赖属性
  • Linux717 SWAP扩容;逻辑卷条带化
  • 时序数据库选型指南︰为什么IoTDB成为物联网场景首选?
  • 销采一体化 CRM 与 人工管理效率对比
  • Go语言时间控制:定时器技术详细指南
  • 3t车用手动卧式千斤顶设计含8张CAD图纸PDF图
  • git的cherry-pick
  • smolagents - agent迭代式解题过程示例
  • Ollama使用指南-更改默认安装路径和Model路径(安装到非C盘)
  • 【46】MFC入门到精通——MFC显示实时时间,获取系统当前时间GetCurrentTime()、获取本地时间GetLocalTime()
  • HTML 极简个人介绍卡片(侧重语义化标签和响应式布局)
  • HCIE - 云计算方向考什么?一文全解
  • LIN通信驱动代码开发注意事项
  • 木马和Webshell和内存马的区别!
  • 电商行业如何做好网络安全工作?
  • 如何选择合规的上门按摩系统
  • Java中excel字典转换
  • SWD和JTAG区别
  • Kotlin 属性委托 observable 的实现原理
  • 快慢指针的应用
  • CPP学习之list使用及模拟实现
  • Java程序设计学习笔记
  • 玖[9],相机/镜头/光源