2

Reactjs で Xtermjs を使用しようとしています。しかし、私がガイドに従うとき。結果は次のように表示されます。

ここに画像の説明を入力

上部のテキストエリアとテキスト「W」なしで表示する必要があります。

私のコードは次のとおりです。

import React from 'react';
import { Terminal } from 'xterm';
import { FitAddon } from 'xterm-addon-fit'; 

class XTerminal extends React.Component {
    componentDidMount() {
        const {id} = this.props;
        const terminalContainer = document.getElementById(id);
        const terminal = new Terminal({cursorBlink: true});
        const fitAddon = new FitAddon();
        terminal.loadAddon(fitAddon);
        terminal.open(terminalContainer);
        terminal.write('Hello from \x1B[1;3;31mxterm.js\x1B[0m $ ');
        fitAddon.fit();
    }

    render() {
        return(
            <div id={this.props.id}></div>
        )
    }
}

export default XTerminal;

答えのないスタックオーバーフローで同様の質問を見つけました。その質問にはコメントできません。だから私はこの質問を書きます。誰でも助けてもらえますか?ありがとう :)

4

1 に答える 1