vue + xterm 前端终端terminal

server/2024/12/22 9:51:30/

引入

javascript">import {Terminal} from "xterm";
import {FitAddon} from "xterm-addon-fit";
import "xterm/css/xterm.css";

html

javascript"><div id="terminal"></div>

vue

javascript">onMounted(() => {nextTick(() => {initTerm();})
})const initTerm = async () => {let termContainer = document.getElementById("terminal");term = new Terminal({lineHeight: 1.3,fontSize: 15,fontFamily:"WenQuanYi Micro Hei, Monaco, Menlo, Consolas, 'Courier New', monospace",theme: {background: '#181d28',},unicodeVersion: 12,convertEol: true,// 光标闪烁cursorBlink: true,cursorStyle: 'underline',scrollback: 100,tabStopWidth: 4,});term.open(termContainer)
};

write

命令含义
term.write(‘\n’)换行
term.write(‘\r’+内容)从头替换当前行内容
write(‘\x1b[2K\r’)删除当前整行

调整光标位置

javascript">term._core.buffer.x = 0;

http://www.ppmy.cn/server/90184.html

相关文章

流媒体服务器一:使用成熟的流媒体SRS 搭建 RTMP流媒体服务器

1 安装和测试srs流媒体服务器 服务器&#xff1a;SRS(Simple RTMP Server&#xff0c;⽀持RTMP、HTTP-FLV&#xff0c;HLS) 推流端&#xff1a;ffmpeg OBS 拉流端&#xff1a;ffplay VLC srs播放器 1.1 安装srs流媒体服务器 官网 SRS (Simple Realtime Server) | SRS 码…

视觉巡线小车——STM32+OpenMV(四)

目录 前言 一、整体控制思路 二、代码实现 1.主函数 2.定时器回调函数 总结 前言 通过以上三篇文章已将基本条件实现&#xff0c;本文将结合以上内容&#xff0c;进行综合控制&#xff0c;实现小车的视觉巡线功能。 系列文章请查看&#xff1a;视觉巡线小车——STM32OpenMV系列…

spring —— 全注解实现事务管理器

全注解实现事务管理&#xff0c;就是取消 spring-config.xml 文件&#xff0c;而将配置信息在配置类中实现。 配置类&#xff1a; package com.spring.book;import com.alibaba.druid.pool.DruidDataSource; import org.springframework.context.annotation.Bean; import org…

前端地位蹭蹭蹭Up!!!

作者&#xff1a;溪饱鱼 链接&#xff1a;juejin.cn/post/7283642910301192244 顺便吆喝一句&#xff0c;如果你本科学历&#xff0c;对技术大厂有向往&#xff0c;对前后端测试岗位有兴趣&#xff0c;不对大厂外包有100%的排斥&#xff0c;可以看看这里&#xff0c;薪酬待遇确…

Linux网络:传输层TCP协议(四)拥塞控制及延迟应答

目录 一、拥塞控制 二、延迟应答 一、拥塞控制 虽然 TCP 拥有滑动窗口这个大杀器机制来根据具体情况对发送的数据大小和速度进行实时控制, 能够高效并且可靠的发送大量的数据. 但是如果在双方建立好连接后的刚开始阶段就发送大量的数据。仍然可能引发一些问题. 因为同一个网…

CSS全部标签属性重置语法

简单介绍 每个浏览器默认的属性不同&#xff0c;像谷歌浏览器不设置的话&#xff0c;默认每个元素是有外边距margin的&#xff0c;有的浏览器列表还会带上序号&#xff0c;有的浏览器就没有。 所以为了让所有浏览器都一致&#xff0c;在写CSS开始前&#xff0c;我们都需要用C…

抖音矩阵管理系统解决方案:一站式服务

在当今社交媒体蓬勃发展的时代&#xff0c;抖音作为一款短视频平台&#xff0c;凭借其独特的魅力和庞大的用户群体&#xff0c;已成为众多企业、个人乃至网红达人展示自我、推广品牌的重要舞台。然而&#xff0c;随着抖音账号数量的不断增加&#xff0c;如何高效、专业地管理这…

(十三)Spring教程——依赖注入之工厂方法注入

1.工厂方法注入 工厂方法是在应用中被经常使用的设计模式&#xff0c;它也是控制反转和单例设计思想的主要实现方法。由于Spring IoC容器以框架的方式提供工厂方法的功能&#xff0c;并以透明的方式开放给开发者&#xff0c;所以很少需要手工编写基于工厂方法的类。正是因为工厂…