首頁 > 文章 > php框架 > 利用ThinkPHP6實現數據表格展示

利用ThinkPHP6實現數據表格展示

王林原創: 2023-06-21 08:37:392009瀏覽

隨著網路技術的發展，資料需求越來越大，尤其是像企業、組織這樣需要進行資料管理和分析的機構。在這樣的背景下，數據表格成為了一種非常重要且常用的數據展示方式，因此掌握如何利用ThinkPHP6實現數據表格展示也變得非常必要。

ThinkPHP是一款流行的PHP開發框架，其使用了MVC架構和物件導向的程式設計思想，透過類別庫封裝和模組化設計，可以大大提高程式碼可讀性、可維護性以及開發效率。在使用ThinkPHP6實作資料表展示方面，它也提供了一些便利的方法和工具，以下我們就來介紹如何使用ThinkPHP6實作資料表展示。

資料庫建表與資料模型類別

首先，我們需要在資料庫中建立表格，並建立資料庫模型類別來呼叫和操作這些資料。例如，我們建立一個學生資訊表格，其中包含id、name、age、gender四個欄位。那麼我們在資料庫中建立這些字段，同時在ThinkPHP的Model目錄下建立一個StudentModel.php的資料模型類別來呼叫和操作這些數據，其中程式碼如下：

namespace appmodel;

use thinkModel;

class StudentModel extends Model
{
    protected $table = 'student';

    public function getStudents()
    {
        return $this->field('id,name,age,gender')->order('id')->select();
    }
}

控制器和視圖

接下來，我們需要在ThinkPHP的Controller目錄下建立一個StudentController.php的控制器類，來處理資料邏輯和渲染頁面。其中，我們可以使用Controller類別的assign方法將從資料庫中取得的資料賦值給模板變量，以便在view視圖中使用。

在視圖方面，我們可以使用layui等前端框架來實現資料表格的渲染和展示。想法是，向前端提供一個json格式的數據，再將這些數據渲染到表格當中。例如，以下為使用layui實作的學生資訊表格展示頁面：

控制器程式碼如下：

namespace appcontroller;

use appmodelStudentModel;
use thinkController;

class StudentController extends Controller
{
    public function index()
    {
        $studentModel = new StudentModel();
        $students = $studentModel->getStudents();
        $this->assign('students', $students);
        return $this->fetch('index');
    }
}

檢視程式碼如下：

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>学生信息表格</title>
    <link rel="stylesheet" href="/layui/css/layui.css">
    <script src="/layui/layui.js"></script>
</head>

<body>
    <table class="layui-table">
        <thead>
            <tr>
                <th>ID</th>
                <th>姓名</th>
                <th>年龄</th>
                <th>性别</th>
            </tr>
        </thead>
        <tbody>
            {% for student in students %}
            <tr>
                <td>{{ student.id }}</td>
                <td>{{ student.name }}</td>
                <td>{{ student.age }}</td>
                <td>{{ student.gender }}</td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
</body>

</html>

3.增加分頁與搜尋功能

我們也可以為學生資訊表格增加分頁和搜尋功能，優化使用者體驗。在ThinkPHP6中，實現這兩個功能非常方便。以下是具體的步驟：

（1）分頁功能

我們可以使用ThinkPHP6提供的paginate()方法，將獲得的學生資訊資料按照給定的一頁顯示資料大小進行分頁，具體程式碼如下：

$students = $studentModel->paginate(10);

在檢視中，我們可以利用layui等前端框架來實現分頁的展示，例如在body內加上：

<div id="page" style="margin-top: 30px; text-align: center;"></div>

<!-- 定义js -->
<script>
    layui.use(['laypage'], function () {
        var laypage = layui.laypage;
        laypage.render({
            elem: 'page', //注意，这里的 test1 是 ID，不用加 # 号
            count: {{ students.total }}, //数据总数
            limit: {{ students.list_rows }}, //显示的条数
            curr: {{ students.currentPage }}, //当前页数
            theme: '#1E9FFF',
            jump: function (obj, first) {
                //首次不执行
                if (!first) {
                    //跳转到新页面
                    window.location.href = '?page=' + obj.curr;
                }
            }
        });
    });
</script>

（2）搜尋功能

我們可以使用ThinkPHP6提供的where()方法，根據搜尋關鍵字對學生資訊資料進行篩選，具體程式碼如下：

$keyword = input('get.keyword');
$students = $studentModel
                ->where('name', 'like', "%{$keyword}%")
                ->paginate(10);

在視圖中，我們可以利用TableFilter等前端外掛程式來實現搜尋的展示和功能實現，例如在頭部加上：

<form class="layui-form" action="/" method="get"
    style="margin-bottom: 20px; text-align: right;">
    <input type="text" name="keyword" id="keyword" placeholder="请输入姓名" autocomplete="off"
        class="layui-input" style="width: 200px; display: inline-block;">
    <button class="layui-btn" lay-submit lay-filter="search">搜索</button>
</form>

<!-- 定义js -->
<script>
    layui.use('tableFilter', function () {
        var tableFilter = layui.tableFilter;
        var tf = new tableFilter('studentTable', {
            filters: [{
                field: 1,
                mode: 'like'
            }]
        });
    });
</script>

總結

使用ThinkPHP6實現數據表格展示多才多藝、方便快捷，為企業以及想要在互聯網上進行數據管理和分析的組織和個人提供了非常有價值的工具。以上所述，就是如何利用ThinkPHP6實作資料表格展示的方法。掌握了這些技巧，我們可以輕鬆實現各種展示需求，提高數據展示、管理和分析的效率。

以上是利用ThinkPHP6實現數據表格展示的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述：

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

上一篇：如何使用ThinkPHP6實現多終端相容下一篇：如何使用ThinkPHP6實現多終端相容

看更多