layui.table圖片顯示不全和404問題

1.圖片顯示不全

在使用layui.table組件中，加載的圖片顯示不全，需重新定義CSS如下：

.layui-table-cell{
     height: auto!important;
     white-space: normal;
}

 

2.圖片顯示，路徑404

在組件中加載圖片，本人使用的是如：

{field: 'image', title: '商品圖片', align:'center',width:150, templet:'<div><img href="{{ d.image }}"></div>',style:'height:50px;'}

結果：圖片在表格中顯示，但瀏覽器會另外加載一張圖片

使用模板改正就沒有這個問題：

首先定義模板，（因為是laravel框架，所以需要@來避免被解析）：

    <script type="text/html" id="imgTpl">
        <img src="@{{ d.avatar }}">
    </script>

再在layui.table中定義：

{field: 'avatar', title: '頭像', align:'center',width:150, templet:'#imgTpl'}

問題解決