文章列表 · ThinkCMF5从入门到精通

## 文章列表文章列表的应用场景对于一个站点来讲是必不可少的，主要包括以下一种场景。 * 指定数量的文章列表，用于首页等调用 * 带分页的文章列表，用于文章列表页使用 * 图文混排的列表页面 ## 标签库的加载由于CMF5在设计过程中采用了前端portal完全独立，所以在文章列表中使用的标签需要单独来进行引用才能使用。加载标签库代码如下，一般建议在head里引用，一次引用就都能用了，当然如果你想每个页面单独引用或者写在前端Portal的配置文件里也是可以的。 ~~~ <taglib name="app\portal\taglib\Portal"/> ~~~ ## articles标签 | 标签名 | 作用 | 包含属性 | | --- | --- | --- | | articles | 获取文章列表 | field,where,limit,order,page,relation,pageVarName,categoryIds,item | 标签属性: | 标签属性名 | 含义 | | --- | --- | | where | 查询条件变量, 支持数组和字符串,如`$where` | | limit | 最多查出文章数,如果分页开启,此设置无效 | | order | 文章排序方式 | | page | 分页参数,如果设置分页参数会自动分页 | | relation | 关联查询,支持`categories`和`user`,多个以英文逗号分隔 | | pageVarName | 分页后生成的分页变量名,只有设置分页参数时才有效 | | categoryIds | 分类 id,支持数组和字符串(英文逗号分开)| ## 生成文章列表 ### 一个最新文章列表,不分页 ``` <portal:articles limit="5" order="post.published_time DESC" categoryIds="$widget.vars.last_articles_category_id"> <dl class="dl-horizontal"> <dt> <a class="img-wraper" href="{:url('portal/article/index',array('id'=>$vo.id,'cid'=>$vo.category_id))}"> <if condition="empty($vo.more.thumbnail)"> <img src="__TMPL__/public/assets/images/default_tupian4.png" class="img-responsive" alt="{$vo.post_title}"/> <else/> <img src="__TMPL__/public/assets/images/default_tupian4.png" class="img-responsive" alt="{$vo.post_title}"/> </if> </a> </dt> <dd> <a href="{:url('portal/article/index',array('id'=>$vo['id'],'cid'=>$vo.category_id))}">{$vo.post_title}</a> </dd> </dl> </portal:articles> ``` ### 一个文章列表,分页 ```html <div> <php> $where=[ 'post.create_time'=>['egt',0] ]; </php> <portal:articles item="vo" field="" where="$where" order="post.published_time DESC" page="10" relation="categories" categoryIds="$category.id" returnVarName="articles_data"> <div class="list-boxes"> <h2><a href="{:url('article/index',array('id'=>$vo['id'],'cid'=>$category['id']))}">{$vo.post_title}</a> </h2> <p>{$vo.post_excerpt}</p> <div> <div class="pull-left"> <div class="list-actions"> <a href="javascript:;"><i class="fa fa-eye"></i><span>{$vo.post_hits}</span></a> <a href="{:url('article/doLike',array('id'=>$vo['id']))}" class="js-count-btn"><i class="fa fa-thumbs-up"></i><span class="count">{$vo.post_like}</span></a> <a href="{:url('user/favorite/add',array('id'=>$vo['id']))}" class="js-favorite-btn" data-title="{$vo.post_title}" data-url="{:url('portal/article/index',array('id'=>$vo['id'],'cid'=>$category['id']))}" > <i class="fa fa-star-o"></i> </a> </div> </div> <a class="btn btn-warning btn-sm pull-right" href="{:url('article/index',array('id'=>$vo['id'],'cid'=>$category['id']))}">查看更多</a> </div> </div> </portal:articles> </div> <ul class="pagination"> <page/> </ul> ``` 其中显示字段（ field="" ）建议按需填写，CMF默认是空，即显示所有字段数据。CMF中，articles标签默认调用3个表数据，分别为post表，category_post表，user表。默认获取的字段为post.*,user.user_login,user.user_nickname,user.user_email,category_post.category_id这几个，如果你需要其他的字段，则需要加上表名，如排序字段则需要category_post.list_order 比如你的列表只要显示标题和日期，那么只需要写成 ~~~ field="post.id,post.post_title,post.published_time" ~~~ 常用列表数据有 ~~~ {$vo.id} //文章ID号 {$vo.user_id} //文章作者ID {$vo.user_nickname} //文章作者昵称 {$vo.user_login} //文章作者用户名 {$vo.is_top} //是否置顶，0未置顶，1置顶 {$vo.post_status} //文章状态，0未发布，1发布 {$vo.recommended} //是否推荐，0未推荐，1推荐 {$vo.post_hits} //文章访问量 {$vo.post_like} //文章点赞量 {$vo.create_time} //文章创建时间 {$vo.update_time} //文章更新时间 {$vo.published_time} //文章发布时间 {$vo.published_time} //文章发布时间 {$vo.post_title} //文章标题 {$vo.post_keywords} //文章关键词 {$vo.post_excerpt} //文章简短描述 {$vo.post_source} //文章来源 {$vo.post_content} //文章详细内容 {$vo['more']['thumbnail']} //文章缩略图 {$vo['more']['photos']} //相册图集 {$vo['more']['files']} //文章附件 ~~~ >所有日期均要使用{:date('Y-m-d H:i',$vo.published_time)}这种方式来获取。数据库默认存的是int型时间戳。