如何实现BootStrapTable的动态表格

BootStrapTable的动态表格 https://blog.csdn.net/Nerver_77/article/details/82684393 在我们构建BootStrapTable(下文中均称：BsTable)，其中columns参数作为表格列的内容存储，我们的需求是根据返回的数据动态的生成columns参数的内容。从而生成动态表格。

columns参数格式：类似下文

columns: {
    {
        field: 'Id',
        title: '编号',
    },{
        field: 'name',
        title: '名称',
    },{
        field: 'sex',
        title: '性别',
        //自定义方法
        formatter: function (value) {
            if (value == 1) {
                return '男';
            } else if (value == 2) {
                retuen '女';
            }
        }
    },
}

全部代码：

 /**
     *  BsTable动态表格生成
     */
    function sqlExecute() {

        // var sql = $('#sql').val();
        // var connectInfo = $('#connectInfo').val();

        $('#DataQueryTable').bootstrapTable({
            ajax: function (request) {
                $.ajax({
                    type: "post",
                    url: prefix + "/list",
                    contentType: "application/json;charset=utf-8",
                    dataType: "json",
                    json: 'callback',
                    success: function (data) {
                        var json = data.rows;
                        // console.log(json);
                        var dynamicHeader = [];
                        dynamicHeader.push({
                            field: "state",
                            check: true
                        });

                        for (var i = 0; i < (Object.keys(json[0])).length; i++) {
                            var property = (Object.keys(json[0]))[i];
                            console.log(property);
                            dynamicHeader.push({
                                "title": property,
                                "field": property,
                                switchable: true,
                                sortable: true
                            });
                        }

                        // console.log(Object.keys(json[0]));

                        $('#DataQueryTable').bootstrapTable('destroy').bootstrapTable({
                            data: json,
                            toolbar: '#toolbar',
                            cache: false,
                            striped: true,
                            sidePagination: "client",
                            sortOrder: "desc",
                            pageSize: 25,
                            pageNumber: 1,
                            pageList: "[25, 50, 100, All]",
                            showToggle: true,
                            showColumns: true,
                            showExport: true,
                            height: 400,
                            exportDataType: "basic",
                            pagination: true,
                            strictSearch: true,
                            search: true,
                            columns: dynamicHeader
                        });
                    },
                    error: function () {
                        alert("SQL查询错误，请输入正确的SQL语句！");
                        location.reload();
                    }
                });
            }
        });
    };

<button type="button" class="btn btn-primary" onclick="sqlExecute()">
        <i class="fa fa-check"></i>&nbsp;SQL语句执行
    </button>
    <div class="row">
        <div class="col-sm-12 select-table table-striped">
            <table id="DataQueryTable"></table>
        </div>
    </div>