tag tag标签列表

更新时间：2020-10-19 16:48:02 作者：米拓建站

## 概述：
当tag标签的action参数值为“tags.list”时，可循环调SEO设置中tag标签的内容在任意页面显示。
**【注意】**
SEO的tag标签可参考“TAG标签”进行设置：https://doc.metinfo.cn/metinfo/seo/seo_234_1.html

## 使用范围：
可在所有页面对应的模板文件中调用，调用方法一致，作用于所有页面。

## 类型：
数据标签，用于调用数据的标签。
## 语法：
```html
<tag action='tags.list'>
	<li class="d-inline-block m-5">
		<a href="{$v.url}" title="{$v.tag_name}" target="_blank" class="btn btn-sm btn-outline-primary">{$v._tag_name}</a>
	</li>
</tag>
```
**【说明】**
tag标签中的数据内容，可通过$v数组及对应的字段获取，具体可参考下方的“$v数组”。

## 标签原理：
tag标签是数据的集合，数据类型类似js的数组，通过action参数传入值不同来获取不同的数据，当action传参为tags.list时，便可获得tag标签的内容列表数据。
tag标签的语法和js中的for函数类似，在tag标签的内部书写待渲染的html标签，$v为每个循环变量的别名，包含了每条内容的数据。
### tag标签：
```html
<tag action="tags.list">
    <a href="{$v.url}" title="{$v.tag_name}" target="_blank" class="btn btn-sm btn-outline-primary">{$v._tag_name}</a>//通过$v数组调用内容数据
</tag>
```
### for函数：
```js
for(i=0;i<list.length;i++){
	document.write(
		'<a href="'+list[i]['url]+'" title="'+list[i][tag_name]+'">'+list[i]['tag_name']+'</a>'
	);
}
```
**总结：**tag标签是后台返回数据的集合，类似于数组，在传入指定参数后会返回内容数据，在内部编写html代码，并使用$v变量来获取每个内容的数据，这样我们就可以得到一段动态的包含内容信息的html代码了。
$v数组：
    tag标签是一个数据的集合，当action="tags.list"调用文章模块内容列表时，tag标签内部循环需指定$v数组为循环变量的别名，从而调用更多的内容数据。
## 调用语法：
`{$v.字段名称}`
**例如：**
```html
<tag action="tags.list">
	<a href="{$v.url}" title="{$v.tag_name}" target="_blank" class="btn btn-sm btn-outline-primary">{$v._tag_name}</a> //调用带自定义样式的tag关键词名称及对应的聚合内容的页面链接。
</tag>
```
### $v数组中包含的字段：
|tag_name|tag关键字名称|
| ------------ | ------------ |
|_tag_name|带自定义样式的tag关键词名称|
|url|tag关键词聚合内容的页面链接，该页面会显示包含该tag关键词的内容列表|
## 示例：
### 首页如何调用tag标签内容列表
**场景案例：**首页调用tag关键词列表及tag关键词的聚合内容的页面链接。
`其它页面调用的语法与首页一致`
#### 模板代码：
```html
<ul>// 信息列表用ul、li标签的格式，可根据自己需求修改
<tag action="tags.list">
    <li>
		<a href="{$v.url}" title="{$v.tag_name}" target="_blank" class="btn btn-sm btn-outline-primary">{$v._tag_name}</a> //调用带自定义样式的tag关键词名称及对应的聚合内容的页面链接。
</li>
</tag>
```
**【注意】**
实际编写时请去掉注释文字。

#### 前台页面输出HTML：
```html
<ul>
	<li>
		<a href="http://localhost/metinfo_7_2/news/index.php?stype=0&search=tag&content=xiaofei&lang=cn" title="消费"><span style=”font-size:16px;color:#ff0;”>消费</span></a>
	</li>
	<li>
		<a href="http://localhost/metinfo_7_2/news/index.php?stype=0&search=tag&content=huawei&lang=cn" title="华为"><span>华为</span></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"}