Требуется определить текущую геопозицию, после чего вывести на экран соответствующие город и температуру.
У меня имеется компонент, который должен всё это делать.
Как можно это реализовать?
Код:
import React from "react"; import { geolocated } from "react-geolocated"; import "./geolocation.css" class Demo extends React.Component {
constructor(props){
super(props);
this.state = {
temp: "3",
pressure: this.props.coords.latitude,
temp_min: "",
temp_max: ""
};
}
// getData(){
// const api_url = await fetch(`https://www.metaweather.com/api/location/search/?lattlong=${this.props.coords.latitude},${this.props.coords.longitude}`);
// const data = api_url.json();
// console.log(data);
// this.setState({
// data: this.props.coords.latitude
// })
// }
// componentDidMount(){
// fetch(`https://www.metaweather.com/api/location/search/?lattlong=${this.props.coords.latitude},${this.props.coords.longitude}`)
// .then(function (response) {
// return response.json();
// })
// .then(
// (result) => {
// let { temp, pressure, temp_min, temp_max } = result.main
// this.setState({
// temp,
// pressure,
// temp_min,
// temp_max
// });
// })
// .catch(function (error) {
// console.log('Request failed', error)
// });
// }
render() {
return !this.props.isGeolocationAvailable ? (
<div className="myPosition">Your browser does not support Geolocation</div>
) : !this.props.isGeolocationEnabled ? (
<div className="myPosition">Geolocation is not enabled</div>
) : this.props.coords ? (
<table className="myPosition">
<tbody>
<tr>
<td>latitude, {this.state.pressure}</td>
<td id="latitude">{this.props.coords.latitude}</td>
</tr>
<tr>
<td id="longitude">longitude</td>
<td>{this.props.coords.longitude}</td>
</tr>
</tbody>
</table>
) : (
<div className="myPosition">Getting the location data… </div>
);
} } export default geolocated({
positionOptions: {
enableHighAccuracy: false,
},
userDecisionTimeout: 5000, })(Demo);
user
-а или вывести на экран соответствующие город и температуру? – Избыток Сусликов 17 июл в 5:33