하위 구성 요소 클릭시 상위 구성 요소 속성 가져 오기

이것이 내 문제를 해결하는 올바른 방법인지 확실하지 않아 다른 방법도 사용할 수 있습니다.하위 구성 요소 클릭시 상위 구성 요소 속성 가져 오기

하위 구성 요소 (이미지)를 클릭하면 상위 구성 요소의 속성에 액세스 할 수 있기를 원합니다. 여기 내 코드는 지금까지 있습니다 :

부모 구성 요소

import {Image, Grid, Row, Col} from 'react-bootstrap'; 
import React, { Component } from 'react'; 
import localForage from 'localforage'; 
import Activity from './activity'; 


testClick(e){ 
    console.log("click handled", e.target.getAttribute('value')); 
} 

render() { 
    return (
     <Grid> 
      <Row> 
       <Col sm={4} smPush={4}> 
        <h2 className="center-header">Explore Ibiza</h2> 
       </Col> 
      </Row> 
      <Row /> 
       <Activity handleClick={(e)=>{this.testClick(e)}} description="Dining" imageSource="https://lonelyplanetimages.imgix.net/mastheads/95971965.jpg?sharp=10&vib=20&w=1200" /> 
       <Activity description="Diving" imageSource="https://media-cdn.tripadvisor.com/media/photo-s/06/8d/1f/6a/linda-playa.jpg"/> 
       <Activity onClick={this.handleClick} description="Boating" imageSource="https://lvs.luxury/wp-content/uploads/2015/06/1.jpg"/> 
      <Row /> 
     </Grid> 
    ) 
}

하위 구성 요소

return(
<Col sm={4}> 
    <p>{props.description}</p> 
    <Image onClick={props.handleClick} value={props.description} src={props.imageSource}className="activity-image margin-bottom-5"/> 
</Col>

)

설명

현재 값을 얻을 수 있지만 부모 요소의 description 속성을 가져 오려면 어떻게해야합니까?

출처

2017-10-27 Austin Wrenn

정확하게 이해했는지 모르겠지만 부모의 콜백/처리기에 추가 매개 변수를 전달해야한다고 생각합니다.

아마 이런 식으로 뭔가 도움이 될 수 있습니다 :

<Image onClick={e => this.props.handleClick(e, props.description)} ...

출처

2017-10-27 01:48:18

예, 당신은 바른 길에 있었다. 내 솔루션으로 업데이트됩니다! –

@AustinWrenn 다른 사용자의 코드 중 어떤 부분을 편집 할 수 있는지에 대한 많은 논란이 있지만, 일반적으로 코드 변경을 제안하는 * 주석 *을 게시하고 OP가 편집을 수행하도록해야합니다. 명백한 예외는 코드 들여 쓰기/포맷팅 편집 (들여 쓰기가 언어에 필수적인 Python과 같은 언어 제외), 주석의 오타/맞춤법 오류 및 인쇄 된 문자열의 오타 일 수 있습니다. 다른 모든 변경 사항은 코드를 깨거나 작성자의 의도를 변경하거나 질문에 오류를 통합하여 실수로 수정하는 위험을 감수합니다. – robinCTS

@AustinWrenn 다른 편집 유형을 수용 할 수 있는지 보여주기 위해 답을 편집했습니다. 또한 문제가 해결되면 대답 중 하나를 수락하고 유용했던 답변을 upvote하는 것을 잊지 마십시오. – robinCTS

하위 구성 요소 클릭시 상위 구성 요소 속성 가져 오기

답변

관련 문제