介绍 & lt; !——页面/相机/camera.wxml祝辞
& lt; view
类=皌ui-menu-list",
id=皏iew1",
比;
,& lt; button
id=癰1"才能,
大?才能“mini"
类型=皃rimary"才能,
bindtap才能=癱hooseimage"祝辞
获才能取图片
,& lt;/button>
,& lt; button
id=癰2"才能,
大?才能“mini"
类型=安拍躳rimary"
bindtap才能=皊avePhone"祝辞
保才能存
,& lt;/button>
& lt;/view>
& lt;图像
src=https://www.yisu.com/zixun/才能“{{tempFilePaths}}”
catchtap=" chooseImageTap "
模式=" aspectFit ">
/*,页面/相机/camera.wxss */,
.view1 {
高度:才能25 px
}
,
.tui-menu-list {
,,显示:flex;
flex-direction:,才能行;
保证金才能:20 rpx;
,,填充:20 rpx;
} //,/相机/camera.js页面
页面({
,
,,数据:{
,,,tempFilePaths:, & # 39; http://pic2.cxtuku.com/00/01/08/b207004f7104.jpg& # 39;
,,},
,,chooseimage: function (), {
,,,var that =,;
,,,wx.showActionSheet ({
,,,,,itemList:,(& # 39;从相册选择& # 39;,,& # 39;拍照& # 39;],
,,,,,itemColor:,“# CED63A"
,,,,,成功:,function (res), {
,,,,,,,if (! res.cancel), {
,,,,,,,,,if (res.tapIndex ==, 0), {
,,,,,,,,,,,that.chooseWxImage(& # 39;专辑# 39;)
,,,,,,,,,},else if (==res.tapIndex 1), {
,,,,,,,,,,,that.chooseWxImage(& # 39;相机# 39;)
,,,,,,,,,}
,,,,,,,}
,,,,,}
,,,})
,,},
,
,,chooseWxImage: function (类型),{
,,,var that =,
,,,wx.chooseImage ({
,,,,,sizeType:,(& # 39;原始# 39;,,& # 39;压缩# 39;],
,,,,,sourceType:,(类型),
,,,,,数:,1,
,,,,,成功:,function (res), {
,,,,,,,console.log (res)
,,,,,,,that.setData ({
,,,,,,,,,tempFilePaths:, res.tempFilePaths [0],
,,,,,,,})
,,,,,}
,,,})
,,},
,,savePhone: function (), {
,,,wx.getImageInfo ({
,,,,,src:, this.data.tempFilePaths,
,,,,,成功:,function (res), {
,,,,,,,var path =res.path
,,,,,,,wx.saveImageToPhotosAlbum ({
,,,,,,,,,filePath:,路径,
,,,,,,,,,成功:,function (), {
,,,,,,,,,,,wx.showToast ({
,,,,,,,,,,,,,标题:,& # 39;保存成功& # 39;,
,,,,,,,,,,,})
,,,,,,,,,},
,,,,,,,,,失败:,function (res), {
,,,,,,,,,,,wx.showToast ({
,,,,,,,,,,,,,标题:,& # 39;保存失败& # 39;,
,,,,,,,,,,,,,图标:,& # 39;没有# 39;
,,,,,,,,,,,})
,,,,,,,,,}
,,,,,,,})
,,,,,}
,,,})
,,}
})
这篇文章将为大家详细讲解有关微信小程序如何实现拍照和相册选取图片,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。
具体内容如下
布局:
样式:
获取图片路径,显示图片和保存
关于“微信小程序如何实现拍照和相册选取图片”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看的到。
