背景:el-upload的圖片預覽效果不佳,發現el-image的預覽大圖的功能不錯。所以image-viewer。
做法:源碼中拿
坑:此處有用法上的歧義,當在for循環中調用此組件,因為其綁定的opacity(不透明)屬性,在同一父級下透明度為父opacity*子opacity。所以單個圖片的蒙層會和多圖時蒙層顏色不一致(通俗講,多個圖片時,你的背景會是黑的)
解決方法:不在for中調用,只要保證你的每次打開時能將url賦值進你的viewUrl就行了。
用法:下文寫得不錯,這里就不寫了。
————————————————
原文鏈接:https://blog.csdn.net/qq_38977441/article/details/105976959
補充坑:層級問題。關於element ui的el-drawer,z-index初始2000,每打開一次都會+1。由於image-viewer設定了2000所以以后都只會出現在el-drawer下面。
原因:詳見一下鏈接。
————————————————
原文鏈接:https://segmentfault.com/a/1190000039967181
解決辦法:暫時image-viewer的z-index設定5000。