1616
1717 <div class =" py-4" />
1818
19- <div style =" padding : 15px ; border-radius : 1rem ; overflow : hidden ; ; background-color : #002b36 " class =" shadow-6" >
19+
20+ <div style =" padding : 15px ; border-radius : 1rem ; overflow : hidden ; ; background-color : #002b36 ; " class =" shadow-6" >
2021 <div id =" terminal" ></div >
2122 </div >
2223
4849<script lang="ts">
4950
5051import ' xterm/css/xterm.css' ;
51- import type {Terminal } from ' xterm'
52+ import type {ITerminalAddon , Terminal } from ' xterm'
5253import {ismobile , singleton } from " ../singleton" ;
53-
54+ // @ts-ignore
55+ import { WebglAddon } from ' xterm-addon-webgl'
5456
5557export default {
5658
5759 data(){
5860 return {
5961 xterm:null as Terminal ,
60- wtf:false as boolean
62+ addon:null as ITerminalAddon
63+
6164 }
6265 },
6366
6467
6568
6669 unmounted() {
67- this .xterm ?.dispose ()
68- this .xterm = null
70+ this .dispose ()
71+
72+
6973 },
7074
7175
@@ -77,10 +81,7 @@ export default {
7781
7882 this .$nextTick (async ()=> {
7983
80-
81- this .xterm ?.dispose ()
82- this .xterm = null
83-
84+ this .dispose ()
8485
8586 /* await singleton.Instance.socket_send('SendMessage',"cool")*/
8687
@@ -100,6 +101,13 @@ export default {
100101
101102 methods:{
102103
104+ dispose(){
105+ this .addon ?.dispose ()
106+ this .addon = null
107+ this .xterm ?.dispose ()
108+ this .xterm = null
109+
110+ },
103111
104112 toast(){
105113
@@ -135,10 +143,16 @@ export default {
135143
136144 const load = await import (' xterm' )
137145
146+
147+
138148 if (this .xterm ) return
139149
140150
141- this .xterm = new load .Terminal ({cursorBlink:true ,
151+ this .xterm = new load .Terminal ({
152+
153+ allowProposedApi:true ,
154+
155+ cursorBlink:true ,
142156
143157
144158 convertEol:true ,
@@ -173,14 +187,18 @@ export default {
173187
174188 this .xterm .open (el );
175189
176-
177-
178190 el .setAttribute (' contenteditable' , ' true' );
179191 el .setAttribute (' spellcheck' , ' false' );
180192 el .setAttribute (' autocorrect' , ' false' );
181193 el .setAttribute (' autocomplete' , ' false' );
182194 el .setAttribute (' autocapitalize' , ' false' );
183195
196+
197+ this .addon = new WebglAddon ();
198+ this .addon .activate (this .xterm )
199+
200+
201+
184202 this .xterm .onData (async data => {
185203
186204
0 commit comments