vue 模態框 el-dialog 實現點擊圖片查看大圖功能

<!-- 點擊的圖片 -->
<img :src="item.content" class="avatar" @click="imgViewDialog_show(item)" />

<!-- 彈出dialog大圖 -->
<el-dialog title :visible.sync="imgViewDialogVisible" class="imgView-dialog" :modal="false">
	<div class="main">
		<img class="img" width="100%" :src="imgViewDialog_imgSrc" />
    </div>
</el-dialog>

data(){
	return{
		imgViewDialogVisible: false, // 控制dialog顯示隱藏
      	imgViewDialog_imgSrc: "" // 控制圖片src
	}
},

methods: {
    /**
     * 圖片dialog_顯示
     */
    imgViewDialog_show: function(item) {
      this.imgViewDialogVisible = true;
      this.imgViewDialog_imgSrc = item.src;
    },
    /**
     * 圖片dialog_關閉
     */
    imgViewDialog_close: function() {
      this.imgViewDialogVisible = false;
      var self = this;
      setTimeout(function() {
        self.imgViewDialog_imgSrc = "";
      }, 100);
    },
｝