React Native 上几个有趣的问题

问题描述 投票:0回答:0

我想分享我的 React Native 项目。在这里,我遇到了一些问题。我曾多次尝试解决,但都失败了。谁能解决这个问题?

我已经检查了所有关于堆栈溢出的问题。我可以保证这是一个真正的新问题。

错误类型:react-native; 试过:3 - 5 次;

Subhracoder 编码!!!

import React, {useState, useReducer,useEffect} from "react"
import {View, Text, StyleSheet, Image, Dimensions, TouchableOpacity} from "react-native"



import * as Location from "expo-location"

const screenWidth = Dimensions.get("screen").width

export const LandingScreen = () => {

  const[errorMsg, setErrorMsg] = useState("")
  const [address, setAddress] = useState<Location.Address>()
  const [displayAddress, setDisplayAddress] = useState("Waiting for current location")
  
  useEffect(() =>{

      (async () =>{
          let { status } = await Location.requestPermissionsAsync()

          if(status !== "granted"){
           setErrorMsg(
              "permissions not granted ,Allow the app to use location service"
              
            )
          }

          let location: any = await Location.getCurrentPositionAsync()

        const {coords} = location

        if(coords){
          const{latitude, longitude} = coords;
          let addressResponse: any = await Location.reverseGeocodeAsync({
            latitude,
            longitude
          });

          for(let item of addressResponse){
            setAddress(item)
            let currentAddress = `${item.name}, ${item.street}, ${item.postalCode}, ${item.city}`
            setDisplayAddress(currentAddress)

            /*if(address.length > 0){
              setTimeout(()=>{
                navigate("HomeScreen")
              },1000)
          }*/
        }
      }

      


  })

},[])


  return(
    <View style={styles.container}>

     <View style={styles.navigation}/>



      <View style={styles.body}>
      <Image source={require("../images/delivery.png")} style={styles.deliveryIcon}/>
        <View style={styles.addressContainer}>
          <Text style={styles.addressTitle}>Your deliver address</Text>
        </View>

        

       <Text style={styles.addressText}>{displayAddress}</Text>
      </View>

      <View style={styles.footer}/>
      

     

    </View>
  )
}



const styles = StyleSheet.create({
  container:{
    flex:1,
    backgroundColor:'rgba(242,242,242,1)'
  },
  navigation:{
    flex:2,
    
  },
  body:{
    flex:9,
    justifyContent:"center",
    alignItems:"center",
    
  },
  footer:{
    flex:1,
    
  },
  deliveryIcon:{
    width:120,
    height:120
  },
  addressContainer:{
    width:screenWidth - 100,
    borderBottomColor:"red",
    borderBottomWidth:0.5,
    padding:5,
    marginBottom:10,
    alignItems:"center"
  },
  addressTitle:{
    fontSize:24,
    fontWeight:"700",
    color:"#7D7D7D"
  },
  addressText:{
    fontSize:20,
    fontWeight:"200",
    color:"#4F4F4F"
  }
})
javascript reactjs json react-native geolocation
© www.soinside.com 2019 - 2024. All rights reserved.