Vue+ElementUI はページング関数を実装します - mysql データ

<el-ページネーション
        背景
        レイアウト="前へ、ページャ、次へ"
        :ページサイズ="8"
        :total="合計"
        :current-page="ページ番号"
        @current-change="現在の変更を処理する">
</el-pagination>

    getData(オフセット,制限){
      this.axios.post('/php/select.php', qs.stringify({
        オフセット: オフセット、
        制限: 制限、
        タイプ: 「落とし物」
      }), { ヘッダー: { 'Content-Type': 'application/x-www-form-urlencoded' } }).then((res) => {
        res.data === 0の場合{
          合計 = 0;
          このリスト = [];
          戻る;
        }
        this.total = res.data.total
        this.list = res.data.data
        this.loading = false
      }).catch((エラー) => {
        this.$message.error(err)
      })
    }

作成された（）{
    0 を返します。
  },

    現在の変更を処理する(val){
      this.list = [] // 前のページのデータをクリアします this.getData((val-1)*8,8);
    }

<?php
$servername = "localhost";
$username = "ユーザー名";
$password = "パスワード";
$dbname = "データベース名";

// 接続を作成します $conn = new mysqli($servername, $username, $password, $dbname);
// 接続を確認する
($conn->connect_error) の場合 {
    die("接続に失敗しました: " . $conn->connect_error);
} 

$type = $_POST['type'];
//フロントエンドパラメータの開始番号と終了番号を取得します
if ( !isset( $_POST['offset'] ) ) {
 エコー0;
 出口（）;
};
$offset = ( int )$_POST['offset'];

if ( !isset( $_POST['limit'] ) ) {
 エコー0;
 出口（）;
};
$limit = ( int )$_POST['limit'];
//ページネーションクエリデータベース $sql = "SELECT * FROM posts where type='$type' order by id desc LIMIT $limit OFFSET $offset";
$result = $conn->query($sql);

$sqlGetCount = "type='$type' の posts から COUNT(*) cnt を選択";
$rescnt = $conn->クエリ($sqlGetCount);
$rescnt = $rescnt->fetch_assoc();
$arr = 配列();
($result->num_rows > 0)の場合{
 $row = $result->fetch_assoc() の間 {
    配列をプッシュします($arr, $row);
}
 //json_encode($arr, JSON_UNESCAPED_UNICODE) をエコーし​​ます。
 echo json_encode(array_merge(array('data'=>$arr),array('total'=>(int)$rescnt['cnt'])));
 
} それ以外 {
    エコー0;
}
mysqli_close($conn);
?>

「SELECT * FROM posts where type='$type' order by id desc LIMIT $limit OFFSET $offset」

type='$type' の投稿から COUNT(*) cnt を選択