任务46:当前栏目高亮
1, App\Http\Controllers\Index\CateController.php 栏目控制器index()方法 改成 分配当前栏目ID到模板
<?php namespace App\Http\Controllers\Index; class CateController extends BaseController { public function index(int $id){ return view('Index.cate.cate',['cateId'=>$id]); } }
2, App\Http\Controllers\Index\BaseController.php 公共控制器在构造函数中 分配 变理cateId的默认值为0
public function __construct() { $this->getCates(); $this->hotArts(); View::share('cateId',0); }
3,\resources\views\Index\Layout\left.blade.php 增加@if @endif判断,如果是当前栏目则增加active类名,再设置.active的相关样式 ,从而达到当前栏目高亮
<style> .active{background-color:#ff0000; } li.active a{color:#fff;} </style> <nav id="primary-nav" class="primary-navigation phone_menu_col_4"> <div class="menu-primary-container"> <ul id="primary-menu" class="sf-menu sf-js-enabled sf-arrows" style="touch-action: pan-y;"> @foreach($cateRes as $cate) <li class="@if($cate['id'] == $cateId) active @endif"> <a href="{{route('index.cate.index',array('id'=>$cate['id']))}}" aria-current="page">{{$cate->cate_name}}</a> </li> @endforeach </ul></div>
效果如下

END

浙公网安备 33010602011771号