前端工作小结72-实现预览效果

1子组件

成功

      ChangeRest(event, file){
       /*   console.log(event)
          console.log(file)*/
         /* console.log(URL.createObjectURL(file.raw))*/
          this.imageUrl = URL.createObjectURL(file.raw);
         /* this.imageUrl=event.tmp_url
          console.log(this.imageUrl)*/
          console.log(1)
          this.eventSave=event
          console.log(this.eventSave)
          this.$emit("ChangeLest",this.eventSave)
        },

2父组件

     changeRest1(val){
          console.log(2)
          console.log(val)
          this.preview=val.tmp_url
          console.log(this.preview)
          this.form.thumbnail=val.relativepath+val.name
     
        }

3预览效果

通过两个不同的值实现预览 下面做个预览 库里面加个字段即可

posted @   前端导师歌谣  阅读(30)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 25岁的心里话
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 零经验选手,Compose 一天开发一款小游戏!
· 一起来玩mcp_server_sqlite,让AI帮你做增删改查!!
点击右上角即可分享
微信分享提示