Debug客栈
做一个爱分享的程序猿
Debug客栈
Laravel 实现前台网站三级目录

友情提示:此篇文章大约需要阅读 6分钟24秒,不足之处请多指教,感谢你的阅读。订阅本站

效果展示

PS:由于是模仿联想电商前台,前端代码借鉴官网代码。

https://img.debuginn.cn/wp-content/uploads/2019/07/image-44.png
联想商城三级目录

数据库设计

CREATE TABLE `dzushop_types` (
  `id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT 'ID',
  `name` varchar(255) NOT NULL COMMENT '分类名称',
  `pid` int(11) NOT NULL COMMENT '父分类ID',
  `path` varchar(255) NOT NULL COMMENT '路径',
  `sort` int(255) NOT NULL COMMENT '分类排序',
  `is_lou` tinyint(1) NOT NULL COMMENT '是否是楼层分类',
  `title` varchar(255) NOT NULL COMMENT '分类标题',
  `keywords` varchar(255) NOT NULL COMMENT '分类关键字',
  `description` varchar(255) NOT NULL COMMENT '分类描述',
  PRIMARY KEY (`id`) USING BTREE
) ENGINE=InnoDB AUTO_INCREMENT=20 DEFAULT CHARSET=utf8 ROW_FORMAT=COMPACT;

数据库设计思路,如何划分父子分类,主要是看父分类ID及路径字段,路径一直情况下根据共同前缀字段进行划分。

后台数据处理

/**
 * 前台首页方法
 * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
 */
public function index(){
    // 查询导航栏导航
    $types = DB::table('dzushop_types')->get();
    // 处理导航栏
    $type = $this->checkTypeData($types);

    // 赋值数据
    $data = array(
        'type' => $type,
    );
    // 返回试图并赋值
    return view("home.index")
        ->with('data', $data);
}

读取数据库数据交给 checkTypeData 方法处理;

/**
 * 处理数组数据(递归)
 * @param $data
 * @param int $pid
 * @return array
 */
public function checkTypeData($data, $pid=0){
    $newArr = array();

    foreach($data as $key => $value){
        if($value->pid == $pid){
            $newArr[$value->id] = $value;
            $newArr[$value->id]->zi = $this->checkTypeData($data, $value->id);
        }
    }
    return $newArr;
}

前台数据遍历

前台采用Laravel语法进行 foreach 三重循环遍历数据,显示结果。

@foreach($data['type'] as $one)
<li>
    <div class="list_name">
        <a href="#" target="_blank" class="list_nm"
           style="height:28px;line-height:28px"
           >{{ $one->name }}
            <span class="list_usepng list_icona"></span></a>
        <div class="list_cont">
            <div class="list_lt">
                @foreach($one->zi as $two)
                <div class="list_lta">
                    <p>
                        <a href="#" target="_blank">{{ $two->name }}</a></p>
                    <ul class="clearfix">
                        @foreach($two->zi as $three)
                        <li>
                            <a href="#" target="_blank">
                                {{ $three->name }}</a>
                        </li>
                        @endforeach
                    </ul>
                </div>
                @endforeach
            </div>
        </div>
    </div>
</li>
@endforeach
赞赏
本文链接:https://www.debuginn.cn/3541.html
本文采用 CC BY-NC-SA 3.0 Unported 协议进行许可,转载请保留此文章链接
相关链接: 首页  |  引导页  |  赞助本站  |  @QQ  |  @微博  |  @Bilibili  |  @推特  |  @Github  |  阿里云活动
社会主义核心价值观: 富强、民主、文明、和谐、自由、平等、公正、法治、爱国、敬业、诚信、友善

发表评论

textsms
account_circle
email

Debug客栈

Laravel 实现前台网站三级目录
效果展示 PS:由于是模仿联想电商前台,前端代码借鉴官网代码。 联想商城三级目录 数据库设计 CREATE TABLE `dzushop_types` ( `id` int(10) unsigned NOT NULL AUTO_INCRE…
扫描二维码继续阅读
2019-07-29