React Native Airbnb谷歌地圖甚至不顯示

所以我試圖使用airbnb的react-native-maps，但它似乎並沒有顯示它甚至不是空白的（它甚至不需要空間儘管我給了它絕對的價值）。我檢查了Android清單，並且我已經完成了反應本地鏈接的事情，每個依賴關係都在那裏。我已經嘗試了一切。React Native Airbnb谷歌地圖甚至不顯示

import React, { Component } from 'react'; 

import { 
    Container, 
    Header, 
    Title, 
    Content, 
    Button, 
    Icon, 
    List, 
    ListItem, 
    CheckBox, 
    Text, 
    Left, 
    Right, 
    Body, 
} from 'native-base'; 

import { 
    View, 
} from 'react-native' 


import styles from './styles'; 

import MapView from 'react-native-maps'; 

class NHCheckbox extends Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     checkbox1: true, 
     checkbox2: true, 
     checkbox3: true, 
     checkbox4: false, 
     region: { 
     latitude: 37.78825, 
     longitude: -122.4324, 
     latitudeDelta: 0.0922, 
     longitudeDelta: 0.0421, 
     } 
    }; 
    } 

    onRegionChange(region) { 
    this.setState({ region }); 
    } 


    toggleSwitch1() { 
    this.setState({ 
     checkbox1: !this.state.checkbox1, 
    }); 
    } 

    toggleSwitch2() { 
    this.setState({ 
     checkbox2: !this.state.checkbox2, 
    }); 
    } 

    toggleSwitch3() { 
    this.setState({ 
     checkbox3: !this.state.checkbox3, 
    }); 
    } 

    toggleSwitch4() { 
    this.setState({ 
     checkbox4: !this.state.checkbox4, 
    }); 
    } 

    render() { 
    return (
     <Container style={styles.container}> 
     <Header> 
      <Left> 
      <Button transparent onPress={() => this.props.navigation.navigate('DrawerOpen')}> 
       <Icon name="menu" /> 
      </Button> 
      </Left> 
      <Body> 
      <Title>Check Box</Title> 
      </Body> 
      <Right /> 
     </Header> 

     <View style ={styles.container2}> 
     <MapView 
      style={styles.map2} 
      region={this.state.region} 
      onRegionChange={this.onRegionChange} 
     /> 
     </View> 


     <Content> 
      <View style ={styles.container2}> 
      <MapView 
       style={styles.map2} 
       region={this.state.region} 
       onRegionChange={this.onRegionChange} 
      /> 
      </View> 

      <Text>{JSON.stringify(this.state.region)}</Text> 

      <ListItem button onPress={() => this.toggleSwitch1()}> 
      <CheckBox checked={this.state.checkbox1} onPress={() => this.toggleSwitch1()} /> 
      <Body> 
       <Text>Lunch Break</Text> 
      </Body> 
      </ListItem> 
      <ListItem button onPress={() => this.toggleSwitch2()}> 
      <CheckBox color="red" checked={this.state.checkbox2} onPress={() => this.toggleSwitch2()} /> 
      <Body> 
       <Text>Daily Stand Up</Text> 
      </Body> 
      </ListItem> 
      <ListItem button onPress={() => this.toggleSwitch3()}> 
      <CheckBox color="green" checked={this.state.checkbox3} onPress={() => this.toggleSwitch3()} /> 
      <Body> 
       <Text>Finish list Screen</Text> 
      </Body> 
      </ListItem> 
      <ListItem button onPress={() => this.toggleSwitch4()}> 
      <CheckBox color="#000" checked={this.state.checkbox4} onPress={() => this.toggleSwitch4()} /> 
      <Body> 
       <Text>Discussion with Client</Text> 
      </Body> 
      </ListItem> 
     </Content> 
     </Container> 
    ); 
    } 
} 

export default NHCheckbox;

styles.js

const React = require('react-native'); 

const { StyleSheet } = React; 

export default { 
    container: { 
    backgroundColor: '#FFF', 
    }, 
    container2: { 
    ...StyleSheet.absoluteFillObject, 
    height: 400, 
    width: 400, 
    justifyContent: 'flex-end', 
    alignItems: 'center', 
    }, 
    map2: { 
    ...StyleSheet.absoluteFillObject, 
    }, 

};

來源

2017-09-24 Leonardo

假設你的AndroidManifest.xml有谷歌API密鑰包括正常，嘗試通過flex: 1替換所有...StyleSheet.absoluteFillObject完全伸展自己的父母內部意見不使用絕對值。

來源

2017-09-24 19:56:06

React Native Airbnb谷歌地圖甚至不顯示

回答

相關問題