tzfun / vue-web-terminal

A beautiful web-side command line window plugin (simulating a terminal).
https://tzfun.github.io/vue-web-terminal/
Apache License 2.0
234 stars 25 forks source link

success 回调中的文本过长会超出组件 #81

Closed Avalibur closed 2 months ago

Avalibur commented 2 months ago

@exec-cmd="onExecCmd" 中success参数消息体对象的content如果比较长,会导致显示的文本超出组件范围 ,希望可以增加功能使得超出的部分自动换行

tzfun commented 2 months ago

content有对折行做处理,除非这是一个链接或引用,能提供一张你的异常显示截图吗?success回调的内容也提供一下

Avalibur commented 2 months ago

1713333422457 我再这里返回了一个对象

const analyticalCommand = (command: string): TerminalData => {
    let TD: TerminalData;
    let key = command.split(' ')[0];
    let value = command.split(' ')[1];
    let params = command.split(' ').slice(2);
    TD = { type: CMDTYPE.Normal, class: LOGLEVEL.Success, tag: TAG.Success, content: params[0] }
    return TD;
}

这里是组件的回调

const onExecCmd = async (key: string, command: string, success: (arg0: TerminalData) => void, failed: (arg0: string) => void) => {
    let TD: TerminalData = analyticalCommand(command)
    if (TD.tag === TAG.Success) {
        success(TD)
    } else {
        failed(TD.content)
    }
}

这里是组件的一些配置 <terminal ref='myTerminalRef'name="cmd_win" @exec-cmd="onExecCmd" :show-header="false" :init-log=[] :line-height="26" ></terminal>

tzfun commented 2 months ago

这个截图里面的param是一个非正常的“单词”,浏览器认为它不应该被折行,对于这种情况其实你可以选择其他 type 来显示,比如code或html,一长串aaabbb其实已经不是正常文本了,normal 类型是用来显示常规的正常的文本,比如你输入一段文本就会自动折行

image
Avalibur commented 2 months ago

好的 ,应该再实际环境中应该不会出现这样的问题,是我的测试方式有些极端了。感谢你的回答。