组件
<template> <div>
<input id="upload_file" type="file" style="display: none;" accept='image/*' name="file" @change="fileChange($event)"/>
<div class="image-item space" @click="showActionSheet()">
<div class="image-up"></div>
</div>
<div class="upload_warp">
<div class="upload_warp_img">
<div class="upload_warp_img_div" v-for="(item,index) in imgList">
<div class="upload_warp_img_div_top">
<img src="http://huoche.7234.cn/images/jb51/z1fh3smwhx3.png" class="upload_warp_img_div_del" @click="fileDel(index)">
</div>
<img :src="item.file.src" style="display: inline-block;">
</div>
<div class="upload_warp_left" id="upload_warp_left" @click="fileClick()" v-if="this.imgList.length < 6">
<!--<img src="../assets/upload.png">-->
<img src="../assets/images/添加图片.png" class="imgs"/>
</div>
</div>
</div>
<div class="upload_warp_text">
<span>选中{{imgList.length}}张文件，共{{bytesToSize(this.size)}}</span>
</div>
</div>
</template>
javaScript代码
<script type="text/ecmascript-6">
export default {
name: "cameras-and-albums",
data(){
return{
imgList: [],
datas: new FormData(),
files:0,
size:0
}
},
methods:{
//调用相册&相机
fileClick() {
$('#upload_file').click(); },
//调用手机摄像头并拍照
getImage() {
let cmr = plus.camera.getCamera();
cmr.captureImage(function(p) {
plus.io.resolveLocalFileSystemURL(p, function(entry) {
compressImage(entry.toLocalURL(),entry.name);
}, function(e) {
plus.nativeUI.toast("读取拍照文件错误：" + e.message);
});
}, function(e) {
}, {
filter: 'image'
});
},
//从相册选择照片
galleryImgs() {
plus.gallery.pick(function(e) {
let name = e.substr(e.lastIndexOf('/') + 1);
compressImage(e,name);
}, function(e) {
}, {
filter: "image"
});
},
//点击事件，弹出选择摄像头和相册的选项
showActionSheet() {
let bts = [{
title: "拍照"
}, {
title: "从相册选择"
}];
plus.nativeUI.actionSheet({
cancel: "取消",
buttons: bts
},
function(e) {
if (e.index == 1) {
this.getImage();
} else if (e.index == 2) {
