顯示事情一個接一個在屏幕上的反應，和/終極版

Question

說，我有我的申請作出反應在我的減速器存在以下狀態如下：

{ 
array: ["Person 1", "Person 2", "Person 3"]; 
} 

我想要做的就是這個。我希望用戶按空格鍵，屏幕上會顯示Person 1。我希望用戶再次按下空格鍵，並在屏幕上添加Person 1Person 2，依此類推。

我不知道如何做到這一點，我怎麼能在Redux中控制列表中有多少人顯示。

對於這個非常基本的問題，我很抱歉，我對React/Redux相當陌生。我知道如何才能通過陣列，並且一次顯示一個人，或者一次顯示一個人，或者一次顯示一個人的功能map。但我正在努力將它們逐漸添加到視圖中。

Answer 1

有很多方法可以做到這一點，這裏有一個：

export class App extends Component { 
    constructor(props){ 
    super(props) 
    this.state = { 
     players: [], 
     currentPlayer: 0 
    } 
    } 
    componentDidMount() { 
    document.addEventListener('keypress', (e) => { 
     if (e.keyCode !== 32) return; 
     this.setState({ currentPlayer: currentPlayer + 1 }) 
     // You should check beforehand if you are in the last index of your array, but I'll not do it here. 
    }); 
    } 
    // You need to remove the event Listener on willUnmount as well 
    render() { 
    if (!this.state.players.length) 
     return <div> No Players </div> 
    return (
     <div>{this.state.players[this.state.currentPlayer]}</div> 
    ) 
    } 

這是一些基本的結構，沒有終極版。您可以稍後添加redux，但我建議您在跳轉到Redux之前學習React的基礎知識。