PHP|亚马逊像产品分类树的构建方法

尼耳多
87 阅读3分钟

作者：Vincy。最后修改于2022年10月1日。

如果你想显示类似于Amazon的产品分类树，这个PHP脚本将有所帮助。它对以分层顺序显示分类菜单很有用，就像一棵树。

这个PHP代码的特点是，它建立了一个具有无限深度的多级分类树。它使用递归方法来获得这一点。

在以前的教程中，我们必须看到一个有固定深度的多级下拉菜单。

让我们看看接下来的章节，看看代码是如何在页面中显示分类树的。

类别数据库

这个脚本包含有数据的类别数据库。插入查询创建了类别记录，这些记录与它的父类进行了适当的映射。

包含parent=0的类别记录被称为主类别。每条记录都有排序顺序，以设置在用户界面上的显示优先级。

结构.sql

CREATE TABLE `category` (
  `id` int(10) UNSIGNED NOT NULL,
  `category_name` varchar(50) COLLATE utf8mb4_unicode_ci NOT NULL,
  `parent` int(10) UNSIGNED NOT NULL DEFAULT 0,
  `sort_order` int(11) NOT NULL DEFAULT 0
);

--
-- Dumping data for table `category`
--

INSERT INTO `category` (`id`, `category_name`, `parent`, `sort_order`) VALUES
(1, 'Features', 0, 0),
(2, 'Domain', 0, 1),
(3, 'Digital', 0, 2),
(4, 'Gift cards', 1, 0),
(5, 'International', 1, 1),
(6, 'Popular', 1, 2),
(7, 'e-Gift cards', 4, 0),
(8, 'Business gift cards', 4, 1),
(9, 'In offer', 5, 0),
(10, 'Shipping', 5, 1),
(11, 'Celebrity favourites', 6, 0),
(12, 'Current year hits', 6, 1),
(13, 'Electronics', 2, 0),
(14, 'Arts', 2, 1),
(15, 'Gadgets', 2, 2),
(16, 'Camera', 13, 0),
(17, 'Car electronic accessories', 13, 1),
(18, 'GPS', 13, 2),
(19, 'Handcrafted', 14, 0),
(20, 'Gold enameled', 14, 1),
(21, 'Jewelry', 14, 2),
(22, 'Fabric', 19, 0),
(23, 'Needle work', 19, 1),
(24, 'PSP', 15, 0),
(25, 'Smart phones', 15, 1),
(26, 'Apps', 3, 0),
(27, 'Music', 3, 1),
(28, 'Movies', 3, 2),
(29, 'Dev apps', 26, 0),
(30, 'App Hardwares', 26, 1),
(31, 'Podcasts', 27, 0),
(32, 'Live', 27, 1),
(33, 'Recently viewed', 28, 0),
(34, 'You may like', 28, 1),
(35, 'Blockbusters', 28, 2);

--
-- Indexes for dumped tables
--

--
-- Indexes for table `category`
--
ALTER TABLE `category`
  ADD PRIMARY KEY (`id`);

--
-- AUTO_INCREMENT for dumped tables
--

--
-- AUTO_INCREMENT for table `category`
--
ALTER TABLE `category`
  MODIFY `id` int(10) UNSIGNED NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=36;

类别菜单在HTML中的渲染

这是一个调用PHP递归解析以获得分类树HTML的启动程序。在PHP ZipArchive帖子中，我们使用了同样的递归概念来压缩所包围目录的内容。

此外，它还有一个UI支架来渲染HTML分层分类菜单。

我们创建了一个PHP类CategoryTree来读取和解析数据库中的类别数组。

index.php

<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<?php
require_once __DIR__ . '/CategoryTree.php';
$categoryTree = new CategoryTree();
$categoryResult = $categoryTree->getCategoryResult();
?>
<h1>Choose category</h1>
    <div class="category-menu">
<?php
echo $categoryTree->getCategoryTreeHTML($categoryResult);
?>
</div>
</body>
</html>

这个样式给了分类树一个令人愉悦的外观。由于它显示无限级别的子类别，这个CSS将有助于纠正默认的UI限制。

body {
    font-family: Arial;
    margin-left: 10px;
    margin-right: 20px;
}

ul.category-container li {
    list-style: none;
    padding-left: 10px;
    width: 100%;
}

.category-container a {
    text-decoration: none;
    color: #000;
}

.parent-depth-0 {
    font-size: 22px;
    font-weight: bold;
    border-bottom: #ccc 1px solid;
    padding: 15px 0px 15px 0px;
}

.parent-depth-all {
    font-size: 16px;
    padding-top: 15px;
    font-weight: normal;
}

.no-child {
    font-size: 16px;
    font-weight: normal;
    padding: 15px 0px 0px 0px;
}

.category-menu {
    width: 270px;
    overflow-y: scroll;
    max-height: 800px;
    background: #fffcf2;
    padding: 0px;
}

ul.category-container {
    padding: 10px;
}

读取分类数据并以树形格式建立

这是一个主要的PHP类，从数据库中读取动态类别。

getCategoryTreeHTML ，该函数解析类别结果数组。它递归调用并按其父级解析类别的级别。

在WordPress中，有一个类别行走器来解析术语和分类法。我们已经创建了一个自定义的WordPress步行器来有效地解析类别。

它设置参数parent=0来建立父级类别的菜单项。

结果类别树HTML将是一个嵌套的UL-LI列表，以显示多级菜单。

CategoryTree.php

<?php

class CategoryTree
{

    private $connection;

    function __construct()
    {
        $this->connection = mysqli_connect('localhost', 'root', '', 'db_category_tree');
    }

    function getCategoryTreeHTML($category, $parent = 0)
    {
        $html = "";
        if (isset($category['parentId'][$parent])) {
            $html .= "<ul class='category-container'>\n";
            foreach ($category['parentId'][$parent] as $cat_id) {
                if (! isset($category['parentId'][$cat_id])) {
                    $child = "";
                    if ($category['categoryResult'][$cat_id]['parent'] != 0) {
                        $child = "no-child";
                    }
                    $html .= "<li class= '$child " . "parent-" . $category['categoryResult'][$cat_id]['parent'] . "' >\n" . $category['categoryResult'][$cat_id]['category_name'] . "</li> \n";
                }
                if (isset($category['parentId'][$cat_id])) {
                    $parentDepth0 = "parent-depth-all";
                    if ($category['categoryResult'][$cat_id]['parent'] == 0) {
                        $parentDepth0 = "parent-depth-0";
                    }
                    $html .= "<li class= '$parentDepth0 " . 'parent-' . $category['categoryResult'][$cat_id]['parent'] . "'>\n " . $category['categoryResult'][$cat_id]['category_name'] . " \n";
                    $html .= $this->getCategoryTreeHTML($category, $cat_id);
                    $html .= "</li> \n";
                }
            }
            $html .= "</ul> \n";
        }
        return $html;
    }

    function getCategoryResult()
    {
        $query = "SELECT * FROM category ORDER BY parent, sort_order";
        $result = mysqli_query($this->connection, $query);

        $category = array();

        while ($row = mysqli_fetch_assoc($result)) {
            $category['categoryResult'][$row['id']] = $row;
            $category['parentId'][$row['parent']][] = $row['id'];
        }

        return $category;
    }
}
?>

哪里可以使用分类树代码？

分类树在很多地方都有使用。例如，大多数购物车网站都有一个类别过滤器或菜单来对展示的产品进行分类。

亚马逊商店的分类菜单为终端用户提供了价值，让他们在广阔的区域内缩小范围，找到自己感兴趣的领域。

avatar
文章
阅读
粉丝