在fastadmin中，如何定义一个数据渲染到前端bootstraptable中显示？

在FastAdmin中，可以使用模型类和控制器来将数据查询出来，并将其渲染到前端的BootstrapTable中显示。下面以查询文章列表为例，说明如何实现该功能。

1.在模型类中定义查询方法

// application/admin/model/Article.php
namespace app\admin\model;

use think\Model;

class Article extends Model
{
    protected $table = "article";

    // 查询文章列表数据
    public function getArticleList($params = [])
    {
        $page = isset($params['pageNumber']) ? intval($params['pageNumber']) : 1;
        $pageSize = isset($params['pageSize']) ? intval($params['pageSize']) : 10;
        $sortName = isset($params['sortName']) ? $params['sortName'] : 'id';
        $sortOrder = isset($params['sortOrder']) ? $params['sortOrder'] : 'asc';

        $query = $this->order($sortName, $sortOrder);

        $totalCount = $query->count();

        $rows = $query->limit(($page - 1) * $pageSize, $pageSize)->select();

        return [
            'total' => $totalCount,
            'rows' => $rows,
        ];
    }
}

在上述代码中，定义了getArticleList方法，用来查询文章列表数据。该方法接收一个数组$params，包含以下查询参数：

• pageNumber：当前页码；
• pageSize：每页显示记录条数；
• sortName：排序字段名；
• sortOrder：排序方向（asc或desc）。

$pageSize和$sortName、$sortOrder这三个参数都有默认值，可以根据具体业务情况调整。

函数返回一个数组，包含以下两个元素：

• total：总记录数；
• rows：每页的记录列表。

2.在控制器中调用模型类方法，并将数据渲染到前端BootstrapTable中

// application/admin/controller/Article.php
namespace app\admin\controller;

use app\admin\model\Article as ArticleModel;
use think\Db;

class Article extends Admin
{
    public function index()
    {
        return $this->fetch();
    }

    public function ajaxList()
    {
        $params = $this->request->param();

        $articleModel = new ArticleModel();

        $data = $articleModel->getArticleList($params);

        $result = [
            'total' => $data['total'],
            'rows' => $data['rows'],
        ];

        return json($result);
    }
}

在控制器中，定义了ajaxList方法，用于响应前端的Ajax请求。其中，通过模型类获取文章列表数据，并返回一个数组格式的结果，包含以下两个元素：

• total：总记录数；
• rows：每页的记录列表。

返回的结果通过json函数转换成JSON格式字符串，方便前端解析。

3.在前端页面中使用BootstrapTable

<!-- application/admin/view/article/index.html -->
{% extends "layout/default.html" %}

{% block content %}
    <table class="table" id="table"></table>
{% endblock %}

{% block script %}
    <script>
        $(function () {
            $('#table').bootstrapTable({
                url: '{$router->url('admin/article/ajaxList')}',
                method: 'get',
                pagination: true,
                pageSize: 10,
                search: true,
                sortable: true,
                showRefresh: true,
                showColumns: true,
                detailView: true,
                columns: [
                    {
                        field: 'id',
                        title: 'ID'
                    },
                    {
                        field: 'title',
                        title: '标题'
                    },
                    {
                        field: 'content',
                        title: '内容'
                    },
                    {
                        field: 'create_time',
                        title: '创建时间'
                    }
                ]
            });
        });
    </script>
{% endblock %}

在上述代码中，通过BootstrapTable的url参数设置数据获取的地址，即控制器中定义的ajaxList方法。其他的配置参数可以根据需要进行设置。columns参数用来设置显示的表格列和对应的数据字段。

通过以上步骤，就可以将查询出来的数据渲染到前端BootstrapTable中显示了。