el-table中插入html标签

第一反应就是使用element ui 自带的formatter,但是并不支持返回html标签

百度和google搜索到的结果要么有些复杂要么不能直接用,在学习开源项目小爱admin的时候发现的写法很好地解决了插入html标签的问题

通过template标签+v-if完美解决问题

直接贴代码

<el-table-column
  prop="ticketPhotoUrl"
  label="车票照片"
  align='center'
  >
    <template slot-scope="scope">
        <div>
            <div v-if="scope.row.ticketPhotoUrl">
                <el-button @click="handleShowTicketPhoto(scope.row)">预览</el-button>
            </div>
            <div v-if="!scope.row.ticketPhotoUrl">
                <span>无照片</span>
            </div>
        </div>
    </template>
</el-table-column>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章