Как я могу изменить локальное состояние компонента, используя параметры?

Question

У меня возникают некоторые проблемы при попытке изменить локальное состояние компонента с помощью параметров.

У меня есть такой код:

class App extends Component {
  state = {
    startup: '',
    investor: '',
    realState: '',
    ecoProject: '',
  };

  handleChangeCardSelection = async (e, stateValue, otherCards) => {
    const currentCard = await e.currentTarget.id;

    this.setState({
      [stateValue]: currentCard,
      [otherCards]: '',
    });
  };

  render() {

   const { startup, investor, realState, ecoProject } = this.state;

   return(
     <Card
        id="investor"                  
        onClick={e => this.handleChangeCardSelection(e, [investor])} />
   )
  }
}

Так что, по сути, я не хочусоздать новую функцию для каждого элемента в состоянии.

Все, что я хочу, это вызвать функцию this.handleChangeCardSelection, а затем установить значение элемента, который я хочу, и установить пустые строки для других значений в состоянии.

Как и в случае с приведенным выше кодом, мне нужно сделать что-то вроде:

this.setState({
    investor: 'investor' // or any other value to fill the string
    startup: '',
    realState: '',
    ecoProject: '',
  })

И сейчас, что я получаю от функции, которую я вызываю при нажатии, этосостояние:

"": "investor"
ecoProject: ""
investor: ""
realState: ""
startup: ""
undefined: ""

Что мне не хватает?

Answer 1

Изменить [investor] на investor

onClick={e => this.handleChangeCardSelection(e, investor)} />

Answer 2

Вы неправильно передаете параметр в функцию. Вам не нужно переносить параметр в [] при передаче функции

<Card
    id="investor"                  
    onClick={e => this.handleChangeCardSelection(e, investor)} />