美文网首页
vue 根据返回base 64格式数据转换为图片显示

vue 根据返回base 64格式数据转换为图片显示

作者: web30 | 来源:发表于2021-09-26 12:32 被阅读0次

    需求:后台返回的base 64格式数据转换为图片显示

    效果图 后台返回数据
    <el-table>
      <el-table-column label="电子签章">
         <template slot-scope="scope">
           <img v-if="scope.row.caDisplay" :src="scope.row.caDisplay" alt="" class="ca-img">
         </template>
       </el-table-column>
    </el-table>
    
    // 查询
        onSearch() {
          const params = {
            pageNo: 1,
            pageSize: 20
          }
          this.$requestInternet.post('/api/xxx', params).then(data => {
            this.tableData = data.data
            if (this.tableData && this.tableData.length > 0) {
              this.tableData.forEach(item => {
                // 用base 64前缀格式拼接起来
                item.caDisplay = item.caqmtp ? 'data:image/png;base64,' + item.caqmtp : ''
              })
            }
          })
        },
    

    相关文章

      网友评论

          本文标题:vue 根据返回base 64格式数据转换为图片显示

          本文链接:https://www.haomeiwen.com/subject/yvdqnltx.html