reactnative 获取定位_React Native 地图定位geolocation，获取位置并逆地理转换

componentDidMount() {

this.handleGetLocation();

}

// 获取位置并逆地理转换

handleGetLocation=()=>{

// 当前定位经纬度

navigator.geolocation.getCurrentPosition(

(position) => {

const initialPosition = position

console.log(initialPosition)

const { longitude } = initialPosition.coords

const { latitude } = initialPosition.coords

console.log(`${longitude},${latitude}`)

//通过调用高德地图逆地理接口，传入经纬度获取位置信息

fetch(`http://restapi.amap.com/v3/geocode/regeo?key=2118fd7600536f90d28d&location=${longitude},${latitude}&radius=1000&extensions=all&batch=false&roadlevel=0`, {

method: "POST",

headers: {

"Content-Type": "application/x-www-form-urlencoded"

},

body: ``

})

.then((response) => response.json())

.then((jsonData) => {

try {

console.log(jsonData)

this.setState({

positionValue:jsonData.regeocode.formatted_address,

positionValue2:jsonData.regeocode.addressComponent.province,

positionValue3:jsonData.regeocode.addressComponent.district,

positionValue4: jsonData.regeocode.addressComponent.cityNm,

positionValue5: jsonData.regeocode.addressComponent.adcode,

})

}catch (e) {

}

})

.catch((error) => {

console.error(error);

})

},

(error) => console.log(error),

{ timeout: 20000, maximumAge: 1000 },

)

}

getstlCycleList() {

this.setState({

stlCycleList: stlCycleItem.map((item, index) => (

{item.name}

))

});

}

title="详细地址"

style={{ height: 66 }}

detail={

style={{ textAlign: "right", paddingHorizontal: 10, flex: 1 }}

maxLength={20}

// keyboardType="numeric"

multiline={true}//多行输入

editable={true}//是否可编辑

placeholder="请输入详细地址"

value={this.state.positionValue}

// value={this.state.positionValue2}

onChangeText={text => this.setState({ positionValue: text })}

/>

}

/>

1596624138477.jpg

这里不能写错