[基础用法]
名称:navig
功能:导航菜单标签,可以循环嵌套标签。通常用于网站导航以获取站点导航信息,方便网站会员分类浏览整站信息
语法:
{eju:navig position_id='2' type='top' row='8' currentstyle='active'}
<li class="{$field.currentstyle}"><a href='{$field.navig_url}'>{$field.navig_name}</a> </li>
{/eju:navig}
参数:
position_id='' 导航位置ID
-
position_id='1' 表示PC端主导航
-
position_id='2' 表示PC端顶部导航
-
position_id='4' 表示PC端底部导航
-
position_id='5' 表示移动端中部导航
-
position_id='6' 表示移动端底部导航
row='10' 返回导航菜单列表总数(建议不要与limit属性同时存在,否则row无效)
limit='起始ID,记录数' (起始ID从0开始)表示限定的记录范围(如:limit='1,2' 表示从ID为1的记录开始,取2条记录)
titlelen='30' 栏目名称长度
type='top' 表示顶级栏目
-
type='self' 表示同级栏目
-
type='son' 表示下级栏目
-
type='sonself' 表示当前下级栏目以及同级栏目
-
type='first' 表示当前栏目ID的最顶级栏目下的所有层级栏目集合
currentstyle='' 应用样式class类名
offset=‘0’ 记录的起始ID,默认从0开始,假如指定2,将过滤最前面的2条,从第三条显示
name='' 数组类型的变量名(三级导航时才用到)
empty='' 没有数据时显示的文案
mod='' 每隔N行输出的内容
id='' 可以任意指定循环里的变量名替代field,假设id='field1',模板调用如:{$field.title} 变成 {$field1.title}
底层字段:
请查阅
易居cms官方提供的数据字典,找到表名 ey_navig_list
-------------------------------效果展示--------------------------------
1,调用一级的PC端顶部导航
模板调用代码
{eju:navig position_id='2' type="top" row="8" id="field" currentstyle="on"}
<li> <a class="{$field.currentstyle}" href="{$field.navig_url}">{$field.navig_name}</a> </li>
{/eju:navig}
-------------------------------示例1--------------------------------
描述:输出最顶级菜单,不包括子孙菜单,可用于网站简单的顶部导航
{eju:navig position_id='2' type="top" row="10" currentstyle="active"}
<a href="{$field.navig_url}" title="{$field.navig_name}" class="{$field.currentstyle}">{$field.navig_name}</a>
{/eju:navig}
-------------------------------示例2--------------------------------
描述:输出二个层级菜单(这里用到navig标签层次嵌套,注意属性id | name的用法)
{eju:navig position_id='2' type='top' row='10' id='field1' currentstyle='active'} // 第一级菜单循环开始
<li>
<a href="{$field1.navig_url}" title="{$field1.navig_name}" class="{$field1.currentstyle}">
{$field1.navig_name}
{eju:notempty name='$field1.children'} // 判断是否有子菜单(该示例指的是第二级菜单)
有子菜单时才显示这里的html代码,比如:箭头、图标等
{/eju:notempty}
</a>
{eju:notempty name='$field1.children'} // 判断是否有子菜单(该示例指的是第二级菜单)
<div>
{eju:navig name='$field1.children' id='field2' row='10'} // 第二级菜单循环开始
<a href="{$field2.navig_url}" class="dropdown-item ">{$field2.navig_name}</a>
{/eju:navig} // 第二级菜单循环结束
</div>
{/eju:notempty}
</li>
{/eju:navig} // 第一级菜单循环结束
-------------------------------示例3--------------------------------
描述:输出复杂的三个层级导航菜单(这里用到navig标签层次嵌套,注意属性id | name的用法)
{eju:navig position_id='2' type='top' row='10' id='field1' currentstyle='active'} // 第一级导航菜单循环开始
<li>
<a href="{$field1.navig_url}" title="{$field1.navig_name}" class="{$field1.currentstyle}">
{$field1.navig_name}
{eju:notempty name='$field1.children'}
有子菜单时才显示这里的html代码,比如:箭头、图标等
{/eju:notempty}
</a>
{eju:notempty name='$field1.children'} // 判断是否有子菜单(第二级菜单)start
<div>
{eju:navig name='$field1.children' id='field2' row='10'} //第二级菜单循环开始
<div>
<a href="{$field2.navig_url}" class="dropdown-item ">{$field2.navig_name}</a>
{eju:notempty name='$field2.children'} // 判断是否有子菜单(第三级菜单)start
<div class="dropdown-menu animate">
{eju:navig name='$field2.children' id='field3' row='10'} //第三级菜单循环开始
<a href="{$field3.navig_url}" class="dropdown-item ">{$field3.navig_name}</a>
{/eju:navig} //第三级菜单循环结束
</div>
{/eju:notempty} // 判断是否有子菜单(第三级菜单)end
</div>
{/eju:navig} // 第二级菜单循环结束
</div>
{/eju:notempty} // 判断是否有子菜单(第二级菜单)end
</li>
{/eju:navig} //第一级菜单循环结束
-------------------------------示例4--------------------------------
描述:每隔3条输出文档记录
{eju:navig position_id='2' row='10' mod='3'}
{eju:eq name='mod' value='0'}
<a href='{$field.navig_url}'>{$field.navig_name}</a>
{/eju:eq}
{/eju:navig}
-------------------------------示例5--------------------------------
描述:mod属性还用于控制一定记录的换行,每3条记录换行一次
{eju:navig position_id='2' row='10' mod='3'}
<a href='{$field.navig_url}'>{$field.navig_name}</a>
{eju:eq name='mod' value='0'}
<br/>
{/eju:eq}
{/eju:navig}
-------------------------------示例6--------------------------------
描述:输出指定起始ID的记录,过滤最前面2条,从第三条开始输出
{eju:navig position_id='2' navigid='导航菜单ID' type='son' offset='2'}
<a href='{$field.navig_url}'>{$field.navig_name}</a>
{/eju:navig}
-------------------------------示例7--------------------------------
描述:内置变量输出数据索引与记录顺序,key 表示索引,默认从0开始;i 表示顺序,默认从1开始。
{eju:navig position_id='2' type='top'}
{$key} - {$i}
{/eju:navig}
效果:
0 - 1
1 - 2
2 - 3
3 - 4
4 - 5
-------------------------------示例8--------------------------------
描述:自定义变量名
{eju:navig position_id='2' type='top' id='field2'}
<a href='{$field2.navig_url}'>{$field2.navig_name}</a>
{/eju:navig}
-
type='self' 表示同级导航菜单
-
type='son' 表示下级导航菜单
-
type='sonself' 表示当前下级导航菜单以及同级导航菜单
-
type='first' 表示当前导航菜单ID的最顶级导航菜单下的所有层级导航菜单集合