Vue+element实现图片的上传与显示

业务逻辑：某个模块新增时新增图片，详情显示也有图片字段，编辑也能对图片进行编辑。

1.图片上传

自己写了一个图片上传的组件，在父组件中引入即可，图片上传组件返回一个图片id的数组，然后在父组件的上传函数中把图片id传给对应的字段即可。

父组件：

<template>
  <div>
    <el-form-item label="图片" prop="img">
      <imageUpload v-on:change="change"/>
    </el-form-item>
  </div>
</template>

<script>
import imageUpload from '../../../components/imageUpload.vue'
export default {
  components: {
    imageUpload
  },
  data() {
    return {
      imgIdArr: [],
    }
  },
  methods:{
    change(data){
      this.imgIdArr=data
    },
  }
}
</script>

子组件：

<template>
  <el-upload
    class="upload-demo"
    :action="uploadAction"
    :on-remove="onRe