Layui數據表格動態加載操作按鈕

效果：

 

 方法一：綁定模版選擇器

<div class="layui-card">
    <div class="layui-card-body layui-row layui-col-space10">
        <table class="layui-hide" id="deliveryTable" lay-filter="deliveryTable"></table>
        <script type="text/html" id="delivery-table-operate">
            <a class="layui-btn layui-btn-xs" lay-event="edit">備注</a>
            {{#  if(d.EnclosureUrl != ''){ }}
            <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="download">下載簡歷</a>
            {{#  } }}
        </script>
    </div>
</div>

table.render({
                elem: '',
                id: '',
                height: '',
                url: '', //數據接口,
                method: 'post',
                defaultToolbar: ['filter', 'exports', 'print'],
                toolbar: false,
                page: {
                    limit: 10,
                    limits: [10, 20, 30]
                },
                parseData: function (res) { //res 即為原始返回的數據
                   
                },
                cols: [[ 
                    { align: 'center', title: '操作', width: 180, toolbar: '#delivery-table-operate' }
                ]]
            });

方法二：函數轉義（ layui 2.2.5及以上）

table.render({
                elem: '',
                id: '',
                height: '',
                url: '', //數據接口,
                method: 'post',
                defaultToolbar: ['filter', 'exports', 'print'],
                toolbar: false,
                page: {
                    limit: 10,
                    limits: [10, 20, 30]
                },
                parseData: function (res) { //res 即為原始返回的數據
                   
                },
                cols: [[ 
                    { align: 'center', title: '操作', width: 180, templet: OnloadTool }
                ]]
            });

function OnloadTool(data) {
   let htmls = '<a class="layui-btn layui-btn-xs" lay-event="edit">備注</a>';
   if (data.EnclosureUrl != '') {
       htmls += '<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="download">下載簡歷</a>';
   }
   return htmls;
}

官方文檔：https://www.layui.com/doc/modules/table.html#templet