el-table中的img增加el-popover功能

鲁峰
2023-12-01
   <el-table-column fixed label="房间图片" width="120" align="center">
            <template slot-scope="scope">
              <div style="display: flex;justify-content: center;">
                <el-popover placement="right" title width="200" trigger="hover">
                  <div style="width:200px;height:200px;">
                    <img
                      style="width:100%;height:100%;object-fit: cover;"
                      :src="scope.row.icon"
                      alt
                    />
                  </div>
                  <div style="width:100px;height:100px;" slot="reference">
                    <img
                      style="width:100%;height:100%;object-fit: cover;"
                      :src="scope.row.icon"
                      alt
                    />
                  </div>
                </el-popover>
              </div>
            </template>
          </el-table-column>
 类似资料: