跳到主要内容

选择交互

选择交互

可引用该函数后,在需要的位置使用 等待用户输入的一个函数。因为要等待,所以是异步的,使用的时候应当使用 await

selection 的 kind 值为 'check' 时,可用快捷键 ctrl + a 全选、ctrl + z 取消全选、ctrl + r 全反选,且该三个快捷键无法像 ctrl +c 或是 ctrl + d 一样自定义取消。

示例

最简单的使用

import { selection } from 'a-command';

const _p = console.log;

_p('中午吃什么');

const result = await selection([
'包子',
'河北特产之正宗安牛肉徽板面',
'烧烤',
'麻辣烫',
'火锅',
]);

全配置模式

import { selection } from 'a-command';

type Eating = '包子' | '板面' | '烧烤' | '麻辣烫' | '火锅';

const eatList: Eating[] = [{
value: '包子'
label: '包子',
disable: true
}, '板面', '烧烤', '麻辣烫', '火锅'];

const result: Eating | undefined = await selection<Eating>({
info: '中午想吃啥子',
data: ,
resultText: '走,我们就去吃',
errorText: '你丫的不饿就算了',
});

if (result === '包子') {
console.log('不,我就要吃火锅');
}
  • 由于历史原因,第二参数不使用或为 'string' 时,以使用的范性为准,缺省值 string 类型
  • 由于为了更好的处理范性的问题,在使用对象类型的数据时,使用 kind 属性没有明显的提示(使用该参数大多场景是为了配置值为 check ,配置为 radio 等同与未配置,所有提示中仅包含了 check ,但不意味着仅能配置为 check ,亦可配置为 radio ,等同于未配置该属性)

selection 展示效果

一般效果

普通的单选模式标准的展示,当前无禁用项,无被隐藏项

▶︎  请问明天吃什么

◦ 串串
● 火锅
◦ 冒菜
◦ 麻辣烫

多选模式

在多选模式下,需使用空格或是键盘上的左右键进行切换当前项的状态。而当前项并不像单选模式是以不同符号,而是不同的色值区分(展示的不出色差效果)

▶︎  你喜欢的明星

■ 元龙
■ 成龙
■ 元彪
□ 元奎
□ 元华 (倘若此项为光标所在项,此项的前缀为绿色,在支持闪烁的终端闪烁)
□ 元武
□ 元泰

有隐藏项

当终端的尺寸不足或使用者主动设置了展示的项数值时,产生了隐藏。

展示当前项在数据的上部时:

▶︎  您的老家在哪里

◦ 北京
● 上海
◦ 天津
◦ 重庆
◦ 河北
◦ 山西
◦ 黑龙江
...

展示当前项在数据的中部时:

▶︎  您的老家在哪里

...
◦ 安徽
◦ 浙江
● 福建
◦ 湖北
◦ 湖南
◦ 广东
◦ 广西
...

当展示项在数据的底部时

▶︎  您的老家在哪里

...
◦ 陕西
◦ 甘肃
◦ 青海
◦ 宁夏
◦ 新疆
◦ 香港
● 澳门
◦ 台湾

包含禁用项

当包含不可用项时,会展示一个包含不可选择的前缀,在使用时,这些项不可被选中,但其状态可由初始化时传入的数据进行决定。

▶︎ 请预测下一个火的地方旅游

⊗ 山东淄博
⊗ 甘肃天水
⊗ 邯郸大名
⊗ 河南安阳
◦ 四川四姑娘山
● 贵州镇远
◦ 云南泸沽湖
◦ 内蒙额济纳旗