location 面包屑导航

更新时间：2020-05-26 15:15:10 作者：米拓建站

## 概述：
通过`location`标签，可循环调用当前页栏目路径（面包屑导航）在当前页（首页除外）展示。
## 使用范围：
除开首页模板文件外，其他模板文件都可以调用。
## 类型：
数据标签，用于调用当前页栏目路径数据集合的标签。
## 语法：

【说明】location标签中的数据内容，可通过$v数组及对应的字段获取，具体可参考下方的“$v数组”。

## 标签原理：

location标签是数据的集合，数据类型类似js的数组，可获得当前页栏目路径数据集合。
location标签的语法和js中的for函数类似，在location标签的内部书写待渲染的html标签，`$v`为每个循环变量的别名，包含了每条内容的数据。
**location标签：**

**for函数：**

for(i=0;i<list.length;i++){
    document.write('<li><a href="'+list[i]['url]+'" title="'+list[i]['name']+'">'+list[i]['name']+'</a></li>'
    );
    }

总结：location标签是后台返回数据的集合，类似于数组，在标签内部编写html代码，并使用$v变量来获取每个内容的数据，这样我们就可以得到一段动态的包含当前页栏目路径和栏目名称的html代码了。

## $v数组：
location标签是一个数据的集合，location标签内部循环默认已指定$v数组为循环变量的别名，从而调用更多的内容数据。
## 调用语法：{$v.字段名称}

例如：

<location>
    <li><a href="{$v.url}" title="{$v.name}">{$v.name}</a></li> //{$v.url}：栏目页链接地址；{$v.name}：栏目名称
    </location>

### $v数组中包含的字段：

|字段名称   |含义   |
| ------------ | ------------ |
| name  | 栏目名称  |
| url  |  栏目页链接 |

## 示例：
### 详情页如何显示当前栏目路径（面包屑导航）
**场景案例：**文章模块详情页需展示当前文章所属栏目，即显示面包屑导航。

**模板代码：**
在文章详情页文件`shownews.php`中编写此代码：

<ul>
        <li><a href="{$c.index_url}" title="{$c.met_webname}">{$word.home}</a></li>//先写一个首页链接,$c变量请参考文档https://doc.metinfo.cn/mb/mbtag/78.html，$word变量请参考文档https://doc.metinfo.cn/mb/mbtag/77.html，
    <location>// 调用当前页栏目路径（面包屑导航）
    <if value="$v">//通过if标签（if标签文档请查看https://doc.metinfo.cn/mb/mbtag/85.html）判断该栏目级别（class1、class2、class3）是否有栏目，有则渲染该栏目的数据
    
    <li><a href="{$v.url}" title="链接关键词">{$v.name}</a></li>//{$v.url}：栏目页链接地址；{$v.name}：栏目名称
    </if>
    </location>
    </ul>

【注意】
- 其他模块详情页实现面包屑导航的模板代码一致；
- 实际编写时请去掉注释文字。

**前台页面输出HTML：**
假设该文章位于二级栏目【企业新闻】下，则代码如下：

<ul>
    <li><a href="https://www.mituo.cn/" title="米拓官网">网站首页</a></li>
    <li><a href="../news/" title="新闻动态">新闻动态</a></li>//所属一级栏目
    <li><a href="../news/news.php?class2=35" title="企业新闻">企业新闻</a></li>//所属二级栏目
    </ul>

文档中心

米拓学堂

帮助中心

在线交流

{"status":1,"html":"<style type=\"text\/css\">\r\n.onlinebox_three{border:2px solid;}\r\n.onlinebox_three .onlinebox_three_list{width: 160px;padding: 10px 0px;}\r\n.onlinebox_three .online-item{margin-bottom: 5px; padding: 0px 17px; position: relative;display: block;color: #666;}\r\n.onlinebox_three .online-item:last-child{margin-bottom: 0px;}\r\n.onlinebox_three .online-item:hover{background: #f8f8f8;}\r\n.onlinebox_three .online-item i{font-size: 16px;}\r\n.onlinebox_three .onlinebox-open{font-size: 22px;display:none;cursor: pointer;padding: 0 10px; font-size: 18px; line-height: 40px;}\r\n.onlinebox.min .onlinebox-open{display:block;padding:0 10px;background:#444;font-size:18px;line-height:40px;color:#fff}\r\n.onlinebox .onlinebox-min{position: relative;top:-4px;}\r\n@media (max-width: 767px){\r\n.onlinebox_three .online-item{font-size: 12px;padding-top: 6px;}\r\n.onlinebox_three .online-item i{font-size: 14px;}\r\n}\r\n<\/style>\r\n<div id='onlinebox'  class=\"onlinebox onlinebox_three hide\" m-type='online' m-id='online' style=\"border-color:#1baadb;\">\r\n    <div class=\"onlinebox-open\" style=\"background:#1baadb;\"><i class=\"fa fa-comments-o\"><\/i><\/div>\r\n    <div class=\"onlinebox-box\">\r\n        <div class=\"onlinebox-top\" style=\"background:#1baadb;\">\r\n            <div class=\"onlinebox-top-btn font-size-26\">\r\n                <a href=\"javascript:;\" class=\"onlinebox-close\" title=\"\">×<\/a>\r\n                <a href=\"javascript:;\" class=\"onlinebox-min\">-<\/a>\r\n            <\/div>\r\n            <h4>在线交流<\/h4>\r\n        <\/div>\r\n                                    <div class=\"met-editor onlinebox-bottom p-x-10 p-y-5\"><p style=\"text-align: center;\">\r\n    <img src=\"..\/upload\/202001\/1579417409303256.png\" data-width=\"120\" width=\"120\" data-height=\"120\" height=\"120\" title=\"\"\/>\r\n<\/p>\r\n<p style=\"text-align: center;\">\r\n    微信公众号\r\n<\/p>\r\n<p style=\"text-align:center;\">\r\n    <img src=\"..\/upload\/202001\/1579417452544806.png\" data-width=\"150\" width=\"150\" data-height=\"150\" height=\"150\" title=\"\"\/>\r\n<\/p>\r\n<p style=\"text-align: center;\">\r\n    QQ交流群\r\n<\/p><\/div>\r\n    <\/div>\r\n<\/div>","t":"4","x":"10","y":"130"}