Pagination 分页
列表下面的上一页、页码和下一页。
列表超过一页时放在列表下面。只有一页时不显示。
页面里怎么写
Section titled “页面里怎么写”<Pagination page={1} pageCount={4} /><Pagination page={2} pageCount={9} href="/page/{n}" />带 href 时每个页码是链接,{n} 换成页码。不带时页码是按钮:按下发出 ds-page 事件,内容是新的页码,页面显示那一页。改元素的 page 或 page-count 属性会重画分页,所以它能跟着读者筛选后的列表变。
36px 的格子,用导航链接的字体。当前页是奶油色卡片的底色。七页以内全部列出;更多时列出第一页、最后一页和当前页前后各一页,中间用省略号。
| 状态 | 变化 |
|---|---|
| 当前页 | 奶油色卡片底色,墨色文字 |
| 第一页或最后一页 | 上一页或下一页变成 40% 透明度,按了没反应 |
| 只有一页 | 不显示分页 |
分页是名为 “Pages” 的 <nav>,当前页标为当前页。按下后焦点留在新的当前页上。
Pagination.astro。从交付包移植,href 代替 hrefFor,ds-page 事件代替 onChange。