Динамически генерируемые поля ввода - как получить доступ к значению

Question

Я занимаюсь разработкой СПА в реактив.

Один из моих компонентов отображается на массив и генерирует подкомпоненты, которые содержат поля ввода, которые выглядят так:

  <div>
       <textarea placeholder="Please add a response here." id={review._id} 
                        type="text" className={style.responseBox}/><br/>
       <button  onClick={this.submitResponse} className= 
                       {style.responseButton}>Submit your response</button>
 </div>

Как получить обработчик события submitResponse для доступа к значению поля id = {review._id}?

Я бы хотел что-то вроде этого:

(где id - это идентификатор элемента ввода)

submitResponse(event, id){
console.log('user submitted value at input field id", id);
console.log('the value entered by the user at that field is', this.event.id.target.value);
}

Поскольку компонент динамически генерирует эти поля ввода, я не могу объявить их заранее в состоянии, иначе я бы создал эти контролируемые поля ввода.

Спасибо!

Answer 1

вы можете сделать что-то вроде этого.

        <button
            onClick={(event) => {
                this.submitResponse(event, review._id);
            }}
            className={style.responseButton}
        >
            Submit your response
        </button>