在MapView.Callout中使用onPress总是触发

时间:2017-09-17 23:11:50

标签: react-native react-native-ios react-native-maps

当用户在我的地图上选择一个图钉时,我使用MapView.Callout显示一个弹出窗口。

当我在该弹出窗口中添加一个定义了onPress()方法的按钮时,在填充状态时总会触发此方法。即,在加载时 - 我从下面的代码中得到一堆警告:

 render() {
    const {name, type} = this.props;

    return (
        <Card
            containerStyle={styles.bubble}
            title={name}
            image={this.selectImage({type})}>
            <Button
                icon={{name: 'contact-phone'}}
                backgroundColor='#80A33F'
                buttonStyle={{borderRadius: 0, marginLeft: 0, marginRight: 0, marginBottom: 0}}
                title='Book Now'
                onPress={window.alert('button pressed')}
            />
        </Card>
    );
}

如何避免这种情况发生?这发生在地图本身的负载上,而不是当用户点击任何给定的引脚时......

2 个答案:

答案 0 :(得分:1)

试试这个:

<form id="f_det" method="post" action="imovel/<?php echo strtolower(urlencode($imovels->tipo_imob."-".$imovels->bairro_imob."-".$imovels->cidade_imob."-".$tam_m2));?>">

答案 1 :(得分:0)

使用npm i react-native-simple-dialogs

我这样解决了我的问题

import { Dialog } from 'react-native-simple-dialogs';

    <MapView.Marker
      identifier={item.localId}
      coordinate={{latitude: item.location.lat,
      longitude: item.location.lng}}
      onPress={() => this.setState({dialogVisible:true,item:item})}
    >
    <Fa name="map-marker" style={{color:"#673AB7",fontSize:50}} />
   </MapView.Marker>

   <Dialog 
            visible={this.state.dialogVisible} 
            onTouchOutside={() => this.setState({dialogVisible: false})} >

    <Button 
      onPress={()=>this.setState({dialogVisible:false})} 
      transparent style={{alignSelf:'right',position:'absolute',right:5}}>
      <Text><Fa style={{fontSize:30,color:"#673AB7"}} name="close"></Fa>
      </Text>    
    </Button>

    <View style={{flexDirection:"row"}}>
    <Text style={{fontWeight: "bold"}}>Name : </Text>
    <Text>{this.state.item.displayName}</Text></View>

    <Button 
     onPress={()=>{this.setState({dialogVisible:false});
     this.chatNavigate(this.state.item)}} 
     full iconLeft style={{backgroundColor:"#673AB7",width:300}}
     >
     <Icon name='md-chatbubbles'  style={{color:'#fff'}}/>
     <Text style={{color:"#fff"}}>Chat</Text>
     </Button>
  </Dialog>