elementUI上传图⽚实现修改功能
最近项⽬中遇到了管理系统增删改查包含图⽚展⽰上传的功能。
在做到修改功能时，图⽚这⼀栏想要实现的效果是显⽰之前上传的图⽚，也就是通过后端拿到的数据库图⽚地址，然后点击更改或者添加选择新的图⽚，之前显⽰的上传图⽚会⾃动删除，然后显⽰新上传的图⽚。
机械伤害应急预案因为使⽤了之前同事封装好的组件，但是需要有点不⼀样，所以⾃⼰⽹上搜了⼀下，特此总结。
先上图
参考了element官⽅⽂档，通过:file-list属性可以设定默认显⽰的图⽚，官⽅解释是上传的⽂件列表。
意思就是可以通过设定⼀个数组，数组⾥⾯装对象，然后对象中有url属性放地址，可以理解为不需要⼿动点击图⽚上传，通过设定数组中的url就可以有默认已添加好的图⽚显⽰。
data中挂载该属性
健康消费通过这个⽅法，就可以实现需求的第⼀步，点开弹出框就可以看到之前上传过的图⽚。1993年属鸡的最佳配偶
修改按钮是element表格中的，所以直接拿获取数据的w就可以了，⾥⾯就有地址，上图
获取图⽚地址放在file-list⾥
男士搭配这⾥⼀定要放⼀个对象，因为可以默认显⽰多张图⽚。
实现效果图裕字组词
御台所有点丑⼤概是这么个意思
然后点开弹出框，上传图⽚这⼉就有了。
然后第⼆步是想要⼿动添加图⽚后，之前图⽚删除，显⽰新添加的图⽚，这⾥参照官⽅⽂档使⽤@change绑定事件，如上图，我绑定的picUpload，然后默认有两个参数，file和fileList
可爱的孩子
这⾥的file就是⼿动新添加的图⽚
物种起源读后感
拿到了新添加的图⽚，就好办了，直接清空之前默认图⽚路径，然后再把新图⽚路径⽤对象url形式放进去就好了
再试⼀下
点击⼀张好看的妹妹图⽚，点击打开，搞定啦
搞定
总结，还是要参考elementUI的官⽅⽂档，默认显⽰图⽚参数名字file-list，获取最新上传图⽚的url使⽤@change事件，接受参数，其他的就是逻辑步骤，清空赋值就⾏了。
