出力中にnodejsの入力を処理する

Question

私はnodejsで、すべてのことを混乱させることなく、画面上に他のものを印刷しながらユーザー入力を待つことができるプログラムを作ろうとしています。私は次のような結果を得る

setInterval(function(){ 
     console.log("just displaying some stuff"); 
},1000); 
process.stdin.on("data", function(char) { 
    console.log(char); 
}); 

次のコードを使用して

just displaying some stuff 
just displaying some stuff 
'this is' just displaying some stuff 
'in'just displaying some stuff 
'put'just displaying some stuff 

私が探していた結果が何かのようである：

just displaying some stuff 
just displaying some stuff 
just displaying some stuff 
just displaying some stuff 
just displaying some stuff 
'this is input' 

任意のアイデアは？私はほとんど役に立った何かを見つけることができませんでした。

Answer 1

ncursesや他のテキストベースのUIライブラリでも同様のことができます。ノードには、blessedという優れたモジュールがあり、そのようなことを手助けすることができます。参照：

• https://www.npmjs.com/package/blessed

それはさらに複雑なユースケースといくつかの素晴らしいデモを持っている：あなたのケースで

あなたが画面全体にマイナスを取り窓を作ることができます1行とそこにテキストを印刷します。必要に応じて1行上またはそれ以上になることができる下の2番目のウィンドウで入力を取得します。

シンプルなものを置くよりも複雑になるでしょうが、それは確かに可能ですし、そうではないと言う人には聞かないでください。

Answer 2

rspと同様に、blessedはこれのための優れたツールです。使用する実装の例を次に示します。

私はblessedを使って画面の一番下にテキストボックスを作成しました。画面の残りの部分はコード出力が追加される '本体'です。このように、入力を入力すると、プログラムはあなたが経験したような出力を混乱させません。

npm install blessed --saveを実行し、これを試して、そのノードでこのコードを実行します。ここ

const blessed = require('blessed'); 

var screen = blessed.screen(); 
var body = blessed.box({ 
    top: 0, 
    left: 0, 
    height: '100%-1', 
    width: '100%', 
    keys: true, 
    mouse: true, 
    alwaysScroll: true, 
    scrollable: true, 
    scrollbar: { 
    ch: ' ', 
    bg: 'red' 
    } 
}); 
var inputBar = blessed.textbox({ 
    bottom: 0, 
    left: 0, 
    height: 1, 
    width: '100%', 
    keys: true, 
    mouse: true, 
    inputOnFocus: true, 
    style: { 
    fg: 'white', 
    bg: 'blue' // Blue background so you see this is different from body 
    } 
}); 

// Add body to blessed screen 
screen.append(body); 
screen.append(inputBar); 

// Close the example on Escape, Q, or Ctrl+C 
screen.key(['escape', 'q', 'C-c'], (ch, key) => (process.exit(0))); 

// Handle submitting data 
inputBar.on('submit', (text) => { 
    log(text); 
    inputBar.clearValue(); 
}); 

// Add text to body (replacement for console.log) 
function log(text) { 
    body.pushLine(text); 
    screen.render(); 
} 


/* 
* Demonstration purposes 
*/ 

// Listen for enter key and focus input then 
screen.key('enter', (ch, key) => { 
    inputBar.focus(); 
}); 

// Log example output 
setInterval(() => { 
    log("just displaying some stuff"); 
}, 1000); 

キーポイントは以下のとおりです。

• あなたのコードはlog機能を使用して出力を表示する必要があります。これをconsole.logドロップイン代替品と考えてください。 console.*の機能をもう使用しないでください。祝福された画面が表示されなくなります。
• 入力を受け取るためには、inputBar要素を「フォーカスする」必要があります。しかし、常に焦点を当てることができますが、私のデモンストレーションではエンターキーを押すか、青いバーをクリックしてフォーカスを合わせます。
• 画面を操作するコードを記述する場合は、screen.render()を実行して変更内容をレンダリングしてください。