很多时候做多级栏目的时候需要让当前点击的栏目高亮显示,点击一级栏目的时候一级栏目高亮显示,点击二级的时候二级栏目高亮显示,点击三级的时候三级栏目高亮显示。
控制器代码:
public function cs($aid,$bid='',$cid='')
{
//$aid=一级分类id $bid=二级分类id $cid=三级分类id
//默认获取全部一级分类,在什么情况下都获取出来
$acate = Db::name('bbs_cate')->where('type',1)->select();
//如果点击了一级栏目则获取当前一级栏目下的所有二级栏目
$bcate = Db::name('bbs_cate')->where('pid',$aid)->select();
//如果点击了二级栏目则显示当前二级栏目下的所有三级栏目,否则输出一个空数组
if($bid == ''){
$ccate = array();
}else{
$ccate = Db::name('bbs_cate')->where('pid',$bid)->select();
}
//默认显示所有一级栏目下的所有商品,思路是商品表建立三个字段aid bid cid分别代表一级二级三级栏目id
$goods = Db::name('bbs_article')->where('aid='.$aid)->select();
//如果点击了某个二级栏目则显示当前二级栏目下的的所有商品
if($bid){
$goods = Db::name('bbs_article')->where('bid='.$bid)->select();
}
//如果点击了某个三级分类则显示当前三级分类下的所有商品
if($cid){
$goods = Db::name('bbs_article')->where('cid='.$cid)->select();
}
return view()->assign([
'acate'=>$acate,
'bcate'=>$bcate,
'ccate'=>$ccate,
'goods'=>$goods
]);
}
html代码:
<!--先获取所有一级栏目-->
<ol class="breadcrumb">
{volist name="acate" id="v"}
<li class="breadcrumb-item"><a href="/cs/{$v.id}"
class="{$Request.param.aid==$v.id ? 'text-success':''}">{$v.name}</a></li>
{/volist}
</ol>
<!--如果控制器里接收到的一级栏目id=当前栏目id,则输入一个高亮显示代码text-success--
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="/cs/{$Request.param.aid}"
class="{$Request.param.bid ?? 'text-success'}">全部</a></li>
{volist name="bcate" id="v"}
<li class="breadcrumb-item"><a href="/cs/{$Request.param.aid}/{$v.id}"
class="{$Request.param.bid==$v.id ? 'text-success':''}">{$v.name}</a></li>
{/volist}
</ol>
<ol class="breadcrumb">
{volist name="ccate" id="v"}
<li class="breadcrumb-item active"><a href="/cs/{$Request.param.aid}/{$Request.param.bid}/{$v.id}"
class="{$Request.param.cid==$v.id ? 'text-success':''}">{$v.name}</a></li>
{/volist}
</ol>