Maison  >  Article  >  cadre php  >  Utilisez ThinkPHP6 pour réaliser l'affichage de tableaux de données

Utilisez ThinkPHP6 pour réaliser l'affichage de tableaux de données

王林
王林original
2023-06-21 08:37:392010parcourir

Avec le développement de la technologie Internet, la demande de données augmente, en particulier pour les institutions comme les entreprises et les organisations qui ont besoin de gérer et d'analyser des données. Dans ce contexte, les tableaux de données sont devenus un moyen très important et couramment utilisé d'afficher des données, il est donc devenu très nécessaire de maîtriser comment utiliser ThinkPHP6 pour afficher des tableaux de données.

ThinkPHP est un framework de développement PHP populaire qui utilise l'architecture MVC et des idées de programmation orientée objet. Grâce à l'encapsulation de bibliothèque de classes et à la conception modulaire, il peut considérablement améliorer la lisibilité du code, la maintenabilité et l'efficacité du développement. En ce qui concerne l'utilisation de ThinkPHP6 pour réaliser l'affichage de tableaux de données, il fournit également des méthodes et des outils pratiques. Présentons comment utiliser ThinkPHP6 pour réaliser l'affichage de tableaux de données.

  1. Création de tables de base de données et classes de modèles de données

Tout d'abord, nous devons créer des tables dans la base de données et créer des classes de modèles de base de données pour appeler et exploiter ces données. Par exemple, nous créons un tableau d'informations sur les étudiants, qui contient quatre champs : identifiant, nom, âge et sexe. Ensuite, nous créons ces champs dans la base de données, et en même temps créons une classe de modèle de données StudentModel.php dans le répertoire Model de ThinkPHP pour appeler et exploiter ces données. Le code est le suivant :

namespace appmodel;

use thinkModel;

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

    public function getStudents()
    {
        return $this->field('id,name,age,gender')->order('id')->select();
    }
}
  1. Contrôleur et vue
.

Ensuite, nous devons créer une classe Controller StudentController.php dans le répertoire Controller de ThinkPHP pour gérer la logique des données et afficher la page. Parmi eux, nous pouvons utiliser la méthode assign de la classe Controller pour attribuer les données obtenues de la base de données à la variable modèle à utiliser dans la vue.

En termes de vues, nous pouvons utiliser des frameworks frontaux tels que layui pour restituer et afficher des tableaux de données. L'idée est de fournir des données au format json au front-end, puis de restituer les données dans un tableau. Par exemple, ce qui suit est une page d'affichage de tableau d'informations sur les étudiants implémentée à l'aide de layui :

Le code du contrôleur est le suivant :

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');
    }
}

Le code d'affichage est le suivant :

<!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.Ajouter des fonctions de pagination et de recherche

Nous pouvons également. ajoutez des fonctions de pagination et de recherche au tableau d'informations sur les étudiants. Fonction de recherche pour optimiser l'expérience utilisateur. Dans ThinkPHP6, il est très pratique d'implémenter ces deux fonctions. Voici les étapes spécifiques :

(1) Fonction de pagination

Nous pouvons utiliser la méthode paginate() fournie par ThinkPHP6 pour paginer les données d'informations obtenues sur l'étudiant en fonction de la taille des données d'affichage de la page donnée. Le code spécifique est le suivant :

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

Dans la vue, nous pouvons utiliser des frameworks frontaux tels que layui pour implémenter l'affichage de la pagination, par exemple, ajouter dans le corps :

<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) Fonction de recherche

Nous pouvons utiliser la méthodewhere() fournie par ThinkPHP6 pour rechercher en fonction des mots-clés de recherche Pour filtrer les données d'informations sur les étudiants, le code spécifique est le suivant :

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

Dans la vue, nous pouvons utiliser des plug-ins frontaux tels que TableFilter pour réaliser l'affichage de la recherche et l'implémentation de fonctions, par exemple , ajoutez dans l'en-tête :

<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>

Résumé

Utilisez ThinkPHP6 pour implémenter l'affichage du tableau de données est polyvalent, pratique et rapide, fournissant un outil très précieux pour les entreprises ainsi que les organisations et les particuliers qui souhaitent gérer et analyser des données sur Internet. Ce qui précède explique comment utiliser ThinkPHP6 pour afficher des tableaux de données. En maîtrisant ces compétences, nous pouvons facilement répondre à divers besoins d'affichage et améliorer l'efficacité de l'affichage, de la gestion et de l'analyse des données.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn