input

本篇文章是Phaser系列的一部分。點擊這裡查看該系列的第一篇文章。 滑鼠事件會在遊戲物件上觸發，因為我們通常是透過滑鼠點擊元素。而鍵盤事件則不會與特定的遊戲物件相關聯，我們只是按下鍵盤上的按鍵。 所以我們需要在this.input.keyboard對象上監聽這些事件，如下所示： this.input.keyboard.on(<event>, function() { }) <event>是一個字符串，可以是keyup或keydown，用於捕捉所有按下的按鍵，或是結合某個特定按鍵的字符，例如： keyup-A keyup-THREE keydown-F12 keydown-ENTER 我們可以使用許多標識符，包括： A ~ Z F1 ~ F12 BACKSPACE TAB ENTER SHIFT CTRL. ALT PAUSE CAPS_LOCK ESC SPACE PAGE_UP, PAGE_DOWN END, HOME LEFT, UP, RIGHT, DOWN PRINT_SCREEN INSERT, DELETE ZERO, ONE, TWO, THREE, FOUR, FIVE, SIX, SEVEN, EIGHT, NINE NUMPAD_ZERO, NUMPAD_ONE, NUMPAD_TWO, NUMPAD_THREE, NUMPAD_FOUR, NUMPAD_FIVE, NUMPAD_SIX, NUMPAD_SEVEN, NUMPAD_EIGHT, NUMPAD_NINE, NUMPAD_ADD, NUMPAD_SUBTRACT 除了監聽單個按鍵外，我們還可以通過調用this.input.keyboard.createCursorKeys()方法獲得一個按鍵對象： let cursors function create() { cursors = this....

＃React，雙擊編輯文本 如何在React中雙擊元素時編輯頁面的某部分 我需要監聽元素的雙擊事件並使該元素可編輯。 一種方法是使用toggle狀態變量，當元素被雙擊時顯示不同的元素： const [toggle, setToggle] = useState(true) const [name, setName] = useState('test') ... toggle ? ( <p onDoubleClick={() => { setToggle(false) }} >{name}</p> ) : ( <input type='text' value={project.status} /> )} 然後，我們將一些屬性添加到input元素。首先，我們將name狀態分配給value屬性。 然後，我們使用onChange()事件監聽器來在input字段的內容發生變化時設置name變量的值。 最後，我們使用onKeyDown()來攔截Enter或Escape按鍵事件，並返回顯示p元素： <input type="text" value={name} onChange={(event) => { setName(name) }} onKeyDown={(event) => { if (event.key === 'Enter' || event.key === 'Escape') { setToggle(true) event.preventDefault() event.stopPropagation() } }} /> 你也可以在該函數中添加任何副作用，例如在需要時將值保存到其他位置。

如何使用内置的readline Node模块使Node.js CLI程序具有交互性 如何使Node.js CLI程序具有交互性？ Node自版本7开始提供了readline模块，可以实现从可读流（比如process.stdin流，它在Node程序执行期间是终端输入）逐行获取输入。 const readline = require('readline').createInterface({ input: process.stdin, output: process.stdout }) readline.question(`What's your name?`, (name) => { console.log(`Hi ${name}!`) readline.close() }) 这段代码会询问用户名，一旦文本被输入，并且用户按下回车键，我们会发送一条问候语。 question()方法会展示第一个参数（一个问题），并且等待用户输入。一旦按下回车键，它会调用回调函数。 在这个回调函数中，我们关闭了readline接口。 readline还提供了其他几个方法，我会让你自己在我上面提供的包文档中去查阅。 如果你需要输入密码，最好不要将其回显，而是显示为*符号。 最简单的方法是使用readline-sync包，它在API方面与上述方法非常相似，并且直接处理了这个问题。 一个更完整和抽象的解决方案则是由Inquirer.js包提供。 你可以使用npm install inquirer进行安装，然后你可以像这样重现上面的代码： const inquirer = require('inquirer') var questions = [{ type: 'input', name: 'name', message: "What's your name?", }] inquirer.prompt(questions).then(answers => { console.log(`Hi ${answers['name']}!`) }) Inquirer.js可以让你做很多事情，比如提问多个选择、使用单选按钮、确认等等。 值得知道所有的选择，尤其是Node提供的内置选择，但如果你计划将CLI输入推向一个新的层次，Inquirer.js是一个优秀的选择。