当我单击反应按钮时，如何将所选项目调用到 model 中？

Question

how can i call selected item into model when i click on button in react? I tried this code but it gave me same output for every buttons...

More Details

            <div class="modal fade" tabIndex="-1" id="exampleModal" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title" id="exampleModalLabel">Details</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body" onClick={this.update}>
                            <h4>{this.state.data.name}</h4>
                            <h5>Region :- {this.props.item.region}</h5>
                            <h6>Capital :-{this.props.item.capital}</h6> 
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                            {/* <button type="button" class="btn btn-primary">Save changes</button> */}
                        </div>
                    </div>
                </div>
            </div>

Answer 1

 handleItem(capital){ console.log(capital) } render(){ return( <div class="modal fade" tabIndex="-1" id="exampleModal" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="exampleModalLabel">Details</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> <div class="modal-body" onClick={this.update}> <h4>{this.state.data.name}</h4> <h5>Region:- {this.props.item.region}</h5> <h6>Capital:-{this.props.item.capital}</h6> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-dismiss="modal" onClick={this.handleItem.bind(this,this.props.item?.capital)} >Close</button> {/* <button type="button" class="btn btn-primary">Save changes</button> */} </div> </div> </div> </div> ) }

i think you are missing onclick event where you can get the value