touchable要素内でpressイベントをlistenする要素

Question

私は、プレスイベントをリスンする要素を持っています。どのように私は触れることができる要素でこれを包み込み、私のカスタム要素がイベントを引き続き聞くことができますか？

私はこの

<TouchableOpacity 
    onPress={(e) => { console.log(e.nativeEvent); }} 
    style={{ flex: 1 }} 
> 
    <EpubDocumentReader 
     toggleEditHighlightModal={this.toggleEditHighlightModal} 
     onPress={(cfi, contents) => { console.log(cfi); }} 
     styleWidthBook={styleWidthBook} 
    /> 
</TouchableOpacity> 

のような構造をした今TouchableOpacity漁獲量は、イベントを押すが、それは、子要素にイベントを起動しません。

Answer 1

達成しようとしていることは何ですか？

カスタムコンポーネントのonPressは呼び出されません。 TouchableOpacityのonPressだけが呼び出されます。

あなたができることはコンポーネントでsetStateでき、次のレンダリングサイクルでイベントをEpubDocumentReaderに渡すことができることです。

<TouchableOpacity 
    onPress={(e) => { 
     console.log(e.nativeEvent); 
     this.setState({ 
      event: e 
     }) 
    }} 
    style={{ flex: 1 }} 
> 
    <EpubDocumentReader 
     event={this.state.event} 
     toggleEditHighlightModal={this.toggleEditHighlightModal} 
     onPress={(cfi, contents) => { 
      console.log(cfi); 
     }} 
     styleWidthBook={styleWidthBook} 
    /> 
</TouchableOpacity> 

もちろん、コンストラクタでinitialStateを設定する必要があります。

constructor(props){ 
    super(props) 
    this.state = { 
    event: null 
    } 
}