@ dolusoft/ command- 控制台
Vue 3 无头命令控制台 : useCommandConsole 编辑 CommandConsole 构成部分
命令控制台中,将一个输入行上方的条目回滚
提示:用户键入一行,控制台为它运行您的命令,并显示命令返回的内容. 线条编辑,
回顾、完成、取消、上下文堆栈和敏感行的编辑是库的;命令,
所有文字和造型都是你的 (一) 无海上保安系统的船只; vue 3.5+是其唯一的同位素.
pnpm add @dolusoft/command-console
全向导(命令、返回和效果、完成、召回、密钥、敏感行)是 仓库读取器。 。 。 .
构成部分
<script setup lang="ts">
import { ref } from 'vue'
import {
CommandConsole,
type CommandDefinition,
type ConsoleEntry
} from '@dolusoft/command-console'
const commands: CommandDefinition[] = [
{ name: 'echo', run: request => request.rest },
// From argument 1 on the line is secret: it is never kept, shown or emitted.
{
name: 'set',
sensitive: { fromArg: 1 },
run: (request, run) => save(request.args, run.signal)
},
{ name: 'exit', run: () => ({ effects: [{ type: 'close' }] }) }
]
const entries = ref<ConsoleEntry[]>([])
const open = ref(true)
</script>
<template>
<CommandConsole
v-if="open"
v-model:entries="entries"
:commands="commands"
prompt="app>"
autofocus
@close="open = false"
/>
</template>
- 回顾、完成和背景 总是在.
entries, (中文(简体) ),recall财务报告和审定财务报表context属于控制台,除非 约束v-model:*· ;initialState给出未绑定切片的第一个值. - 道具 :
commands, (中文(简体) ),prompt, (中文(简体) ),initialState, (中文(简体) ),createId, (中文(简体) ),maxEntries, (中文(简体) ),beforeRun, (中文(简体) ),onError, (中文(简体) ),formatError, (中文(简体) ),isSensitive, (中文(简体) ),recallLimit, (中文(简体) ),shouldRecord, (中文(简体) ),labels, (中文(简体) ),autofocus, (中文(简体) ),entries编号 :recall编号 :context,以及console。 。 。 . - 一个超过组件的控制台:
:console="pageConsole"绘制其它处创建的控制台 可选特性, 并且从不处理它, 因此挂载的面板会显示相同的条目和活输入 。 其备选方案 是它的创造者:console, (中文(简体) ),commands改为shouldRecord财务报告和审定财务报表entries编号 :recall编号 :context丢出一个TypeError· ;labels财务报告和审定财务报表autofocus应用. - 活动 :
update:entries, (中文(简体) ),update:recall, (中文(简体) ),update:context(计:v-model,每个解析的数值为最后一个 释放,所以两个变化 在一勾同时保留,close(一个命令)close影响)和submit(单位:千美元){ inputId, sensitive },绝不是行;对于 Enter 和曝光的run) (中文(简体) ). - 槽数 :
block-text, (中文(简体) ),block-json, (中文(简体) ),block-table, (中文(简体) ),block-list, (中文(简体) ),block-message, (中文(简体) ),block-custom(单位:千美元){ block, entry }, (中文(简体) ), 内置 adiv.cc-block, (中文(简体) ),prompt, (中文(简体) ),busy, (中文(简体) ),completion。一个插槽将取代内容,绝不是带有 钩子. - 标签 : 组件显示的每个文本
labels,超过英语默认值;messages财务报告和审定财务报表actors合并一个 深层和消息可能是其参数的函数。 助理或外部代理人的线条 (单位:千美元)InputEntry.actor显示labels.actors[actor](单位:千美元)AI, (中文(简体) ),Agent(a) 内span.cc-actor在它的及时 条目data-actor。 。 。 . - 显示 :
focus(), (中文(简体) ),run(line), (中文(简体) ),cancel(), (中文(简体) ),reset(), (中文(简体) ),clear(), (中文(简体) ),console财务报告和审定财务报表state(未包装 模板参考 :consoleRef.value.state.running) (中文(简体) ).
样式
本构成部分使纯元素 cc-* 课程和 data-* 属性,列于
contract/dom.ts。没有大小或大小
样式: 给定 .cc-log 高度和 overflow-y: auto 它会滚动,在用户处于时留在下方
在这里.
.cc-log {
height: 20rem;
overflow-y: auto;
}
.cc-block {
margin: 0;
white-space: pre-wrap;
}
.cc-entry[data-tone='error'] {
color: crimson;
}
.cc-console[data-busy] .cc-input {
opacity: 0.6;
}
.cc-completion[aria-selected='true'] {
background: highlight;
}
混凝土
useCommandConsole(options) 在不加标记的情况下给同一控制台: { console, state }时 state 是只读的
ShallowRef 控制台状态 一个值选项( E)commands, (中文(简体) ), prompt, (中文(简体) ), state, (中文(简体) ), maxEntries, (中文(简体) ), recallLimit获取
a 值、 ref 或 getter; 函数选项取其函数或 ref. features 财务报告和审定财务报表 initialState 读取
一次,控制台处理 呼叫范围; useCommandConsole({ console }) 镜像创建的控制台
在别的地方,别无他法,从不处理 可选特征来自
@dolusoft/command-console-core数字 :
import { useCommandConsole } from '@dolusoft/command-console'
import { consoleFeatures, recallFeature } from '@dolusoft/command-console-core'
const { console, state } = useCommandConsole({
features: consoleFeatures({ recallFeature }),
commands: () => commands.value
})
许可证
麻省理工学院,看 利比里亚。 。 。 .