LoM-wiki 公开组件

Tab 分页组件

Tabs 提供属性如以下：

position：设置分页表的位置
- top 默认值：设置分页表在上方
- bottom：设置分页表在下方

Tab 提供属性如以下：

title 必填：设置分页签的文字

我是分页1的内容

源代码

markdown

<Tabs>
    <Tab title="分页1">
        我是分页1的内容
    </Tab>
    <Tab title="分页2">
        我是分页2的内容<br>
        我会换行
    </Tab>
</Tabs>

人物 Icon 懒人组件

目前提供少部分 Icon 与语法示例如下

<BadendIcon>链接预设会跳入生死簿, 可用 :no 指定跳入编号。
目前部分会跳到生死簿的详细页面, 随着发布的页面越多,
BadendIcon 将会自动导入越来越多的详细页面。

我是文字 1
我是文字 2
我是文字 3 生死簿 30『清理门户』

源代码

markdown

<BadendIcon :size='`medium`'>我是文字 1</BadendIcon>
<BadendIcon :size='`small`'>我是文字 2</BadendIcon>
<BadendIcon>我是文字 3</BadendIcon>
<BadendIcon :no="30">生死簿 30『清理门户』</BadendIcon>

<Girl[0-8]Icon>链接预设会跳入人物列传页面，详情参考梦境心上人

small(小型)图案为 32 px _ 32 px,
medium(中型) 图案 100 px _ 100 px。汗青书的尺寸为例外： small(小型)图案为 38 px _ 44 px,
medium(中型) 图案 76 px _ 88 px。

我是文字 4
我是文字 5
我是文字 6

源代码

markdown

<Girl0Icon :size='`medium`'>我是文字 4</Girl0Icon>
<Girl0Icon :size='`small`'>我是文字 5</Girl0Icon>
<Girl0Icon>我是文字 6</Girl0Icon>

人物 Icon 懒人组件使用示例

语法	效果	说明
<BadendIcon :size="`medium`">我是文字</BadendIcon>	我是文字	显示中型 Icon
<BadendIcon :size="`small`">我是文字</BadendIcon>	我是文字	显示小型 Icon
`<BadendIcon>我是文字</BadendIcon>`	我是文字	采用预设大小, 预设为"`small`"
`<BadendIcon></BadendIcon>`		不写任何文字，采用预设大小, 预设为"`small`"
`<BadendIcon :no="30">生死簿30『清理门户』</BadendIcon>`	生死簿 30『清理门户』	no 用来链接生死簿的编号, 不使用则会跳到生死簿最上面。

可用属性写法

属性名称	值	default
size	"`medium`" \| "`small`"	"`small`"
no	0 <= no <= 90	0

目前可用组件

<BadendIcon> : 生死簿 (饮茶躺), 部分预设点击会跳到生死簿主页对应位置，部分会跳到详细页面。
<EndIcon> : 汗青书, 不给 no, 预设点击会跳到汗青书列表。
<EndIcon no="49"> : 汗青书 49：丧家之犬, 添加 no 会跳到指定编号的汗青书。

以下人物头像预设会跳到人物列传页面：

<Girl0Icon> : 小师妹头像
<Girl1Icon> : 瑞杏头像
<Girl2Icon> : 叶云裳头像
<Girl3Icon> : 虞小梅头像
<Girl4Icon> : 上官萤头像
<Girl5Icon> : 夏侯兰头像
<Girl6Icon> : 郁竹头像
<Girl7Icon> : 魏菊头像
<Girl8Icon> : 龙湘头像

物品 Icon 懒人组件

目前提供少部分 Icon 与语法示例如下, 以BookItemIcon为例,
可替换下面已可用组件任一, 只要求no有及物品使用类型对应即可
与人物 Icon 的差别在于多了一个背景，
此外，此组件使用的图片有对应特定位置摆放。

<BookItemIcon>预设有链接, 点击会跳入对应信息页面,
此外, 预设图案为 small(小型, 100 px _ 100 px);
medium 为中型(200 px _ 200 px);
可透过 :size 设置大小。
若 needLink = false 时, 点击图片则会激活图片放大。
仅有no为必填值。

我是文字

我是文字 1

我是文字 2

源代码

markdown

<BookItemIcon :no="6001">我是文字</BookItemIcon>
<BookItemIcon :needLink="false" :no="6001">我是文字 1</BookItemIcon>
<BookItemIcon :size="`medium`" :no="6001">我是文字 2</BookItemIcon>

可用属性写法

因 type 已包含在组件名称中，故不需额外设置。

属性名称	值	default	require
no	根据不同的物品有不同的值	-	o
size	"`medium`" \| "`small`"	"`small`"	x
needLink	true \| false	true	x

目前已可用组件(每一组件代表不同的物品类型)：

<BookItemIcon> : 武学书籍(book),
<FoodItemIcon> : 食物(food),
<NewspaperItemIcon> : 江湖快报(newspaper),
<SpecialItemIcon> : 特殊道具(special),
<TeaItemIcon> : 茶水(tea),
<WineItemIcon> : 酒(wine),

对应摆放路径格式

docs/public/images/items/${type}s/item_${type}_${no}.webp

其中 ${type} 为物品类型，如 book、food、special、tea、wine；
${no} 为物品编号。

举例而言武学书籍(book) 编号为 6001, 图片路径为 docs/public/images/items/books/item_book_6001.webp,
特殊道具(special) 编号为 2003, 图片路径为 docs/public/images/items/specials/item_special_2003.webp

⚠️警告

使用前请先确认是否该图文件存在，若不存在，请一并上传至指定路径。
若不确定物品的分类，请以图片解包原名为主

心相 Icon 懒人组件

我是文字
我是文字 1
我是文字 2
我是文字 3
我是文字 4
我是文字 5
我是文字 6
我是文字 7

源代码

markdown

<MoodIcon :mood="`high`">我是文字</MoodIcon>
<MoodIcon :mood="`good`">我是文字 1/MoodIcon>
<MoodIcon >我是文字 2</MoodIcon>
<MoodIcon :mood="`normal`">我是文字 3</MoodIcon>
<MoodIcon :mood="`low`">我是文字 4</MoodIcon>
<MoodIcon :mood="`bad`">我是文字 5</MoodIcon>
<MoodIcon :mood="`bad`" :size="`medium`">我是文字 6</MoodIcon>
<MoodIcon :mood="`bad`" :size="`small`">我是文字 7</MoodIcon>

可用属性写法

属性名称	值	default	require
size	"`medium`" \| "`small`"	"`small`"	x
mood	"`high`" \| "`good`" \| "`normal`" \| "`low`" \| "`bad`"	"`normal`"	x

Markdown 外部解析工具

用来主动解析被 html 包住的内容
除了换行还是只能使用 <br> 以外，其他的 Markdown 都可以使用

~~我是纯HTML格式~~

源代码

Markdown

<div>
    ~~我是纯HTML格式~~
</div>
<div>
    <MarkdownWrapper>
        ~~我是在HTML中，使用MarkdownWrapper框起来的格式~~
    </MarkdownWrapper>
</div>
<div>
    <MarkdownWrapper>
        ||我还支持防剧透文字||
    </MarkdownWrapper>
</div>

BTable 排序表格

替表格加上排序效果
将外层的 <table> 换成 <BTable> 即可
第一行 <td> 做为标题，可传入 字符串、Markdown、HTML
其他行 <td> 做为表格，可传入 字符串、Markdown、HTML、Component

BTable 提供属性如以下：

:horizontal：将表格转为横向显示
- true：转成横向
- false 默认值：不转成横向
:unsearch：控制表格搜索功能
- true：关闭搜索
- false 默认值：打开搜索
:tags：设置搜索标签(当 unsearch = true 时无效)
- text 必填：标签文字
- icon：标签 icon
searchMode：设置搜索的类型
- and 默认值：交集查找
- or：联集查找
:stickyHeader：设置表头冻结
- true：激活冻结
- false 默认值：关闭冻结

第一行(标题) td 提供属性如以下：

:unsortable：控制字段排序
- true：关闭排序
- false 默认值：打开排序

🅰️ Shaw

源代码

Markdown

<BTable :tags="[
  {
    text: '21',
  },
  {
    text: 'Shaw',
    icon: '🅰️'
  }
]">
  <tr>
    <td>age</td>
    <td>first_name</td>
    <td :unsortable=true>last_name</td> // 此行不排序
  </tr>
  <tr>
    <td>40</td>
    <td>Dickerson</td>
    <td>Macdonald</td>
  </tr>
  <tr>
    <td>21</td>
    <td>Larsen</td>
    <td>Shaw</td>
  </tr>
  <tr>
    <td>89</td>
    <td>Geneva</td>
    <td>Shaw</td>
  </tr>
</BTable>

BTable 内的 <tr> <td> 属性皆会保留

源代码

Markdown

<BTable :unsearch=true>
  <tr>
    <td>age</td>
    <td :unsortable=true>first_name</td> // 此行不排序
    <td>last_name</td>
  </tr>
  <tr style='background-color: #f0f0f0; color: black;'> // 除标题外的 tr 可以设置属性
    <td>40</td>
    <td style='color: red;'>Dickerson</td> // td 也可以
    <td>Macdonald</td>
  </tr>
</BTable>

InfoList 详细数据组件

占据侧边一段空间的组件，
通常用法是在 <InfoList> 底下添加其他文字或是组件，填满同列的剩余空间

InfoList 提供属性如以下：

position：设置组件位置
- left：设置组件在左边
- right 默认值：设置组件在右边
- none：关闭浮动效果

Info 提供属性如以下：

title 必填：设置详细内容的标题文字
:open：预设是否展开

知识科普：
当漂浮元素太长，跟满版对象抢空间，
可以使用 <div style="clear:both;"></div> 限制。

列传一

列传二

我是测试文字我是测试文字我是测试文字我是测试文字
我是测试文字我是测试文字
我是测试文字
我是测试文字
我是测试文字
我是测试文字
我是测试文字
我是测试文字
我是测试文字
我是测试文字
我是测试文字
我是测试文字
我是测试文字
我是测试文字
我是测试文字
我是测试文字
我是测试文字
我是测试文字

源代码

Markdown

<InfoList position="left">
  <Info title="列传一" :open=true>
      师承锦香宫，剑法精绝的清丽佳人。<br>
      踏着父亲从前的足迹踽踽前行，向往能够承其父志，行侠四方。<br>
      虽然如此，由于不谙世事，意外地容易受骗上当。
  </Info>
  <Info title="列传二">
    对父亲的记忆，如今很稀薄了。<br>
    遥远记忆里那一日，他摸摸她小脑袋瓜，<br>
    一笑出门去，便再也不曾回来。<br>
    后来锦香宫温夫人才接了她去，收入门墙。<br><br>
    辗转听人传闻，才知道父亲是武林传奇，<br>
    既悲伤又骄傲，沿着父亲的足迹，造访故人，<br>
    想搜集更多已故生父的故事，凭此怀念。<br><br>
    一身剑法皆得于家传秘笈，龙渊七诀中，尤擅剑法，<br>
    自小便以鸡腿为剑，悟出人剑合一的奥义而浑不自觉，<br>
    至今也不太清楚自己究竟算不算高手。
  </Info>
</InfoList>
我是测试文字*n
<div style="clear:both;"></div>

wikilink

使用 [[]] 包起来的链接，参照对象为 title

LoM-wiki 公开组件

源代码

markdown

[[LoM-wiki 公开组件]]  
[[LoM-wiki 公开组件|自订文字]]  
[[LoM-wiki 公开组件#wikilink|指定锚点]]  
[[LoM-wiki 公开组件|可以在自订文字写~~Markdown语法~~跟<span style='color: red;'>HTML语法</span>]]

结局组件

markdown

<EndBackground no=8 title="被煮的狗">
兔死狗烹，你这走狗已经没有用了．用张<br>
大饼就能骗得你团团转，可真划算．<br>
<br>
<br>
<!-- 注解：此行用于标示给编辑者使用，用户是看不到的。用于提示此处有空行，因排版原因，请勿删除 -->
</EndBackground>

被煮的狗

兔死狗烹，你这走狗已经没有用了．用张
大饼就能骗得你团团转，可真划算．

被煮的狗

兔死狗烹，你这走狗已经没有用了．用张
大饼就能骗得你团团转，可真划算．

markdown

<EndBackground no=0 title="没有对应图片的情况">
没有对应图片的情况<br>
没有对应图片的情况<br>
没有对应图片的情况<br>
<br>
</EndBackground>

没有对应图片的情况

没有对应图片的情况
没有对应图片的情况
没有对应图片的情况

没有对应图片的情况

没有对应图片的情况
没有对应图片的情况
没有对应图片的情况

可用属性写法

属性名称	值	default	require
no	1~50	x	x
title	一般文字	x	x

注：

结局描述直接放在标记符中即可，如以上范例 兔死狗烹，...可真划算．此段文字的位置。
部分结局可能会有图片共用。
此部分显示自动分为行动设备版本与一般版本、若有编辑上异常请于 discord 反馈。
目前已经将排版调整过, 大部分的情况都能与游戏的画面相符，
仅有少部分由于排版限制(或游戏本身排版限制)，可能会有些许差异，
应属误差范围，将于之后有机会再次改进。
若有文字方块区不足长宽问题，请自行补充<br>换行符号或　全角空格。
并于补充文字末尾加注

LoM-wiki 公开组件 ​

Tab 分页组件 ​

人物 Icon 懒人组件 ​

人物 Icon 懒人组件使用示例 ​

可用属性写法 ​

目前可用组件 ​

物品 Icon 懒人组件 ​

可用属性写法 ​

目前已可用组件(每一组件代表不同的物品类型)： ​

对应摆放路径格式 ​

心相 Icon 懒人组件 ​

可用属性写法 ​

Markdown 外部解析工具 ​

BTable 排序表格 ​

InfoList 详细数据组件 ​

wikilink ​

结局组件 ​

可用属性写法 ​

LoM-wiki 公开组件

Tab 分页组件

人物 Icon 懒人组件

人物 Icon 懒人组件使用示例

可用属性写法

目前可用组件

物品 Icon 懒人组件

可用属性写法

目前已可用组件(每一组件代表不同的物品类型)：

对应摆放路径格式

心相 Icon 懒人组件

可用属性写法

Markdown 外部解析工具

BTable 排序表格

InfoList 详细数据组件

wikilink

结局组件

可用属性写法