34、Harp 中文文档 - 如何创建一个贴子列表
2019-07-10
目录
- > 1、/null - Harp 中文文档 - Harp 文档
- > 2、/null - Harp 中文文档 - 快速开始
- > 3、/null - Harp 中文文档 - 安装 Harp
- > 4、/null - Harp 中文文档 - 初始化 Harp 应用
- > 5、/null - Harp 中文文档 - Harp 服务器
- > 6、/null - Harp 中文文档 - Multihost
- > 7、/null - Harp 中文文档 - 编译 harp
- > 8、/null - Harp 中文文档 - 更新 Harp
- > 9、/null - Harp 中文文档 - Express 嵌入式中间件
- > 10、/null - Harp 中文文档 - 规则
- > 11、/null - Harp 中文文档 - 公有和私有文件
- > 12、/null - Harp 中文文档 - 布局
- > 13、/null - Harp 中文文档 - Yield
- > 14、/null - Harp 中文文档 - 局部视图
- > 15、/null - Harp 中文文档 - 全局变量
- > 16、/null - Harp 中文文档 - 元数据
- > 17、/null - Harp 中文文档 - 内容
- > 18、/null - Harp 中文文档 - 当前对象
- > 19、/null - Harp 中文文档 - 环境
- > 20、/null - Harp 中文文档 - 基本认证
- > 21、/null - Harp 中文文档 - “404 不存在”状态码
- > 22、/null - Harp 中文文档 - “200 OK” 状态码
- > 23、/null - Harp 中文文档 - Markdown
- > 24、/null - Harp 中文文档 - EJS
- > 25、/null - Harp 中文文档 - Jade
- > 26、/null - Harp 中文文档 - LESS
- > 27、/null - Harp 中文文档 - Sass
- > 28、/null - Harp 中文文档 - Stylus
- > 29、/null - Harp 中文文档 - CoffeeScript
- > 30、/null - Harp 中文文档 - Harp 平台
- > 31、/null - Harp 中文文档 - 部署到 Github Pages
- > 32、/null - Harp 中文文档 - 部署到 Heroku
- > 33、/null - Harp 中文文档 - Azure
- > 34、/null - Harp 中文文档 - 如何创建一个贴子列表
- > 35、/null - Harp 中文文档 - 如何在每一页上获取到自定义标题和描述
- > 36、/null - Harp 中文文档 - 更多教程
这篇文章教你如何创建你的博客贴子的一个列表，每一个条目包含标题、链接以及贴子内容。
目录结构
给定一个这样的目录结构：
/public
/posts
_data.json
my-first-post.md
my-second-post.md
/index.jade <-- or index.ejs
贴子数据
添加一个这样的 /public/posts/_data.json ：
{
"my-second-post": {
"title": "My second post"
},
"my-first-post": {
"title": "My first post"
}
}
使用 Jade 进行列表
你可以在 Jade 中这样遍历你的贴子：
for post, slug in public.posts._data
h2: a(href="/posts/#{ slug }")= post.title
!= partial("posts/" + slug)
使用 EJS 进行列表
或者在 EJS 中：
<% for(var slug in public.posts._data){ %>
<h2><a href="/posts/<%= slug %>"><%= public.posts._data[slug].title %></a></h2>
<%- partial("posts/" + slug) %>
<% }; %>
工作原理
我们正在使用 for 迭代器来遍历 /public/posts/_data.json 中的数据。可以通过 public.posts._data 获取到贴子数据对象。
