반응하는 앱에 배열에 객체를 추가하는 방법

Question

나는 게임을 배우고 있으며, 카드 게임을 만들려고 노력하고 있습니다. 카드를 클릭하면 그 카드를 빈 배열. 두 번째 카드를 클릭하면 어레이가 첫 번째 카드를 저장하지 않거나 새로운 카드를 클릭 할 때마다 소품의 값이 바뀌므로 올바르게 저장하지 않습니다. 나는 비슷한 질문을했지만 그것들이 게시 한 문제는 다르다.

import React from 'react'; 
import '../memoryGameStyle/card.css'; 

class Card extends React.Component{ 
    constructor(props){ 
     super(props); 
     this.state={card:'' } 
    } 
    onCardClick=()=>{ 
     const array=[] 
     const newCard={...this.props.card,show:true} 
     this.setState({card:newCard}) 
    } 
    render(){...} 
} 

export default Card 

새 카드를 onCardClick의 배열에 푸시하려고합니다. 나는 두 개의 소품을 가지고 있는데, 하나는 클릭하는 카드를 보여주고 다른 하나는 모든 카드의 배열을 보여줄 것입니다. 나는 filter(), push(), spread 연산자, non work까지 사용하려고 시도했다. 제발 도와주세요, 덕분에

Answer 1

당신은 당신의 상태로 카드 변수를 쓰고 있습니다. 이 대신

constructor(props){ 
    super(props); 
    this.state={card:[] } 
} 

면책 조항을 : 아래의 솔루션은 새로운 카드가 내가 이해 무슨에서 선택한 카드

onCardClick=()=>{ 
    const {card} =this.state; 
    const newCard= //get selected card 
    card.push(newCard); 
    this.setState({card:newCard}) 
} 

Answer 2

포함되어 있다고 가정합니다, 당신은이 개 요구 사항이 있습니다 :

• 는 현재이 카드를 클릭보기 .
• 사용자가 과거에 클릭 한 모든 카드를 표시합니다.

  state = { 
      cards: [], 
      showAllClickedCards: true 
  } 
  //"cards" holds the cards clicked by the user 
  //The most recent clicked card will be at the last in the the array. 
  //You can toggle "showAllClickedCards" to either show all cards or selected one 
  

  이제 여기

  당신이 onCardClick

  에

  //Assuming the function is being passed the selectedCard 
  onCardClick = (selectedCard) => { 
      //Do something with selected card 
      this.setState(prevState => ({ 
       cards: [...prevState.cards, selectedCard] 
      })) 
  } 
  

  참고 할 수있다 : 전류를 표시하려면 여기

//Let me know if that's not the case는 2 가지 이상하고 싶지는 가정 할 수있는 일입니다 당신이 할 수있는 클릭 한 카드 this.state.cards[this.state.cards.length - 1].
희망 하시려면