2016-08-16 17 views
1

私は地図のマーカーをクリックしてモーダルを表示しようとしていますが、私はマーカーのクリックでモーダルを見ることができません誰でも問題を教えてください。私はここでhttps://github.com/maxs15/react-native-modalboxモーダルは反応ネイティブで表示されませんか?

からモーダルを使用していますコードです:

import Modal from 'react-native-modalbox' 
openModal4(id) { 
    this.refs.modal4.open(); 
    } 

render(){ 
return(
<View style={style.mainContainer}> 
    <MapView 
     ref="map" 
     showUserLocation={true} 
     region={this.state.region} 
     onRegionChange={this.onRegionChange} 
     onRegionChangeComplete={this.onRegionChangeComplete} 
     style={styles.map} 
     rotateEnabled={false} 
     showsCompass={false} 
     > 
     {this.state.markers.map(function(marker){ 
     return(
      <MapView.Marker coordinate={marker.latlng} key={marker.id} onPress={this.openModal4} /> 
     ); 
     })} 
    </MapView> 
    <View style={{position: 'absolute', width: windowsWidth, height: windowsHeight - 100, alignItems: 'center', justifyContent: 'center'}}> 
     <Image 
     source={require('./assets/map-marker.png')} 
     /> 

    </View> 
    <Modal style={[styles.modal, styles.modal4]} position={"bottom"} ref={"modal4"}> 
    </Modal> 
    </View> 
) 
} 

誰も私を助けることができますか?前もって感謝します。

+0

ファイル内にすべてのコードを表示できますか? – stereodenis

+0

あなたは 'React.Component'や' React.createClass'を使って何を見ているのですか?@stereodenis – atif

+0

? – stereodenis

答えて

0

あなたは、バインディング、この記事を読んでDon't Use Bind When Passing Props

openModal4 = (id) => { 
    this.refs.modal4.open(); 
} 
+0

私はまだ下から来てモーダルを見ることができませんか? – atif

+0

openModal4のconsole.log(this.refs.modal4)を呼び出せますか? – stereodenis

+0

console.log(this.refs.modal4)の後に何も表示されません – atif

0

Guysがここに矢印機能=> を使用した後に解決します問題は、コード

openModal4(id){ 
    this.refs.modal4.open(); 
    } 

{this.state.markers.map((marker) => { 
      return(
       <MapView.Marker coordinate={marker.latlng} key={marker.id} onPress={this.openModal4} /> 
      ); 
      })} 
ありました コールバックでこれをバインドするために、変更を加える必要があります

そして、これを 'this'で構成されるコンストラクタでバインドする必要があります

this.openModal4 = this.openModal4.bind(this) 

私の闘争は他人を助けることを願って

関連する問題