选择
选项是玩家与游戏互动最关键的手段——它让玩家能够做出选择,进而影响故事的走向。从程序的角度看,选项通常作为某个 next 动作的一部分出现,以一个数组的形式组织。
一个典型的选项配置看起来像这样:
typescript
next: [
{
content: '打开宝箱',
next: 'treasure-dialog',
maxTimes: 1,
},
{
content: '谨慎离开',
next: 'leave-dialog',
},
]每个选项都是一个 ADVUserChoice 对象,它具有以下常用属性:
| 参数名 | 类型 | 默认值 | 描述 |
|---|---|---|---|
content | string 或 VNode | 无,必填 | 选项按钮上显示的文字。可以是纯文本,也可以是一段 HTML 或 Vue 组件。 |
next | 一个动作 | null | 玩家选择此项后将执行的动作。 |
maxTimes | number | Infinity | 该选项可以被选择的最大次数。超过次数后选项会自动消失。若设为 1,则选择一次后不再出现。 |
visible | () => boolean | () => true | 一个返回布尔值的函数,用于动态控制选项是否可见。当函数返回 false 时,该选项不会渲染给玩家。 |
check | ADVUserCheck | undefined | 检定的配置,检定会在 next 生效之前发生。 |
onChoose | () => void | undefined | 当该选项被选择时,或触发该事件。 |
选项的 next 取值和其他情况的 next 完全一致,因此你可以在选择中再次嵌套选项,从而构建出多分支的剧情树。
你也可以使用链式调用
typescript
Adv.appendDialog('main-dialog')
.say('你要打开宝箱吗')
.next()
.choice({
content: '打开宝箱',
next: 'treasure-dialog',
maxTimes: 1,
})
.choice({
content: '谨慎离开',
next: 'leave-dialog',
})
.build();只有在 next 函数使用之后,才能使用 choice 函数。如果使用了 choice 函数,则 next 函数中的参数将被覆盖。