HTML:
<template>
<view class="">
<u-upload :action="action" v-on:on-success="up" v-on:on-remove="del"></u-upload>
<view class="">
<button type="default" @click="add">上传</button>
</view>
</view>
</template>
JS:
<script>
export default {
data() {
return {
action: 'http://后台给的临时地址换网络地址的接口',
list:[],
url:''
}
},
methods:{
up(e,index){
this.url=e.data.url
},
add(){
console.log(this.url)
},
del(index){
this.url=''
}
}
}
</script>
upload组件上传图片
action 属性可以选择完之后,自动上传到指定服务器地址
v-on:on-success 会获取到返回的http地址,也就是网络地址,可以存到服务器里面访问
v-on:on-remove 移除当前下标的图片,这均是uview自带的毁掉方法
add(自定义)获取地址,del(自定义)拿到index下标,如果是单张图片,可以让url直接为空
如果是多张图片的数组,用arr.splice(index,1)就可以移除那张图片