npm 包 @tdtsh/terminal-menu 使用教程

阅读时长 5 分钟读完

简介

npm 是 JavaScript 的包管理工具,在前端开发中非常常用。@tdtsh/terminal-menu 是一个可用于终端命令行界面的菜单组件,它可以让用户通过输入数字或方向键来选择菜单中的功能。同时它也提供了丰富的 API 接口,可以支持自定义样式和事件。

安装

可以通过 npm 直接安装: npm i @tdtsh/terminal-menu

使用

基本用法

下面是 @tdtsh/terminal-menu 的基本使用方法:

-- -------------------- ---- -------
----- ------------ - --------------------------------

----- --------- - -
  -
    ----- ------- ---
    -- ---
  --
  -
    ----- ------- ---
    -- ---
  -
--

----- ---- - --- ----------------------- -
  ------- -
    --------- -
      --- -------
      --- -------
    -
  -
---

----------------- -------------- -- -
  ------------------------ --------------
---

------------

通过 require('@tdtsh/terminal-menu') 导入该组件。然后在 menuItems 数组中定义菜单选项,可以有很多属性(如 text, disabled, keyBindings等)可以设定。最后在 menu 实例中设置 selected 的样式和 select 监听事件。menu.open 可以让菜单在终端中显示。

接口说明

new TerminalMenu(menuItems[, options])

创建一个菜单实例。

  • menuItems {Array} - 菜单选项数组
  • options {Object} - 配置选项
    • styles {Object} - 自定义样式(可选)
    • width {Number} - 菜单项宽度(可选)
    • x {Number} - 菜单左上角 X 坐标(可选,默认 2)
    • y {Number} - 菜单左上角 Y 坐标(可选,默认 2)
    • exitKeys {String} - 退出菜单的按键(可选,默认 q, escape, return

menu.open()

打开菜单,并将菜单选项渲染到终端中。

menu.close()

关闭菜单,并将菜单选项从终端中移除。

menu.update()

在终端中更新菜单选项。

menu.disable()

禁用菜单。

menu.enable()

启用菜单。

menu.filteredItemIndex(searchString[, startIndex])

搜索菜单中符合条件的选项。

  • searchString {String} - 要搜索的字符串
  • startIndex {Number} - 开始搜索的索引位置(可选,默认为 0)

menu.getSelectedItem()

获取当前选中的菜单选项。

menu.setSelectedItem(index)

通过索引设置当前选中的菜单项。

事件说明

  • select - 当用户选择一个菜单选项时被触发
  • exit - 当用户按退出键时被触发

示例代码

下面是菜单示例代码,可以用于学习和调试:

-- -------------------- ---- -------
----- ------------ - --------------------------------

-- --------
----- --------- - -
  -
    ----- ----- ---
    ------------ ------------ --
  --
  -
    ----- ----- ---
    ------------ ------------ --
  --
  -
    ----- ----- ---
    ------------ ------------ --
  --
  -
    ----- ----- ---
    ------------ ------------ --
  --
  -
    ----- ----- ---
    ------------ ------------ --
  -
--

-- ------
----- ---- - --- ----------------------- -
  ------ ---
  -- --
  -- --
  ------- -
    --------- -
      --- -------
      --- -------
    --
    --------- -
      --- ------
    -
  --
  --------- --------
---

-- -- ------ --
----------------- -------------- -- -
  ---------------- -------- -----------------------
---

-- ----
------------

总结

  • @tdtsh/terminal-menu 是一个可用于终端命令行界面的菜单组件。
  • 它提供了丰富的 API 接口,可以支持自定义样式和事件。
  • 基本使用方法为 require('@tdtsh/terminal-menu') 导入组件,定义 menuItems 数组,创建菜单实例,设置样式和事件,最后打开菜单。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/150397