-1
I’m having a problem, I’m taking a course and is giving this error in React Active, I’ll show you all the code below, can anyone help? I searched about but found no answer That is the mistake:
[Unhandled promise rejection: TypeError: undefined is not a function (near '...setCurrentRegion...')]
* src\pages\Main.js:11:8 in loadInitialPosition
- node_modules\regenerator-runtime\runtime.js:45:44 in tryCatch
- node_modules\regenerator-runtime\runtime.js:271:30 in invoke
- node_modules\regenerator-runtime\runtime.js:45:44 in tryCatch
- node_modules\regenerator-runtime\runtime.js:135:28 in invoke
- node_modules\regenerator-runtime\runtime.js:145:19 in Promise.resolve.then$argument_0
- node_modules\promise\setimmediate\core.js:37:14 in tryCallOne
- node_modules\promise\setimmediate\core.js:123:25 in setImmediate$argument_0
- node_modules\react-native\Libraries\Core\Timers\JSTimers.js:146:14 in _callTimer
- node_modules\react-native\Libraries\Core\Timers\JSTimers.js:194:17 in _callImmediatesPass
- node_modules\react-native\Libraries\Core\Timers\JSTimers.js:458:30 in callImmediates
* [native code]:null in callImmediates
- node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:407:6 in __callImmediates
- node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:143:6 in __guard$argument_0
- node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:384:10 in __guard
- node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:142:17 in __guard$argument_0
* [native code]:null in flushedQueue
* [native code]:null in invokeCallbackAndReturnFlushedQueue
Main.js
import React,{useState,useEffect} from 'react';
import { StyleSheet } from 'react-native';
import MapView from 'react-native-maps';
import { requestPermissionsAsync, getCurrentPositionAsync} from 'expo-location'
function Main() {
const { currentRegion, setCurrentRegion } = useState(null);
useEffect(() => {
async function loadInitialPosition() {
const {granted} = await requestPermissionsAsync();
if(granted) {
const {coords} = await getCurrentPositionAsync({
enableHighAccuracy: true,
});
const { latitude, longitude } = coords
setCurrentRegion({
latitude,
longitude,
latitudeDelta: 0.04,
longitudeDelta: 0.04,
})
}
}
loadInitialPosition();
}, [])
if(!currentRegion){
return null;
}
return <MapView initialRegion={currentRegion} style={{ flex: 1 }}/>
}
const style = StyleSheet.create({
map: {
flex: 1,
},
})
export default Main;
App.js
import React from 'react';
import { StatusBar } from 'react-native';
import Routes from './src/pages/routes';
export default function App() {
return (
<>
<StatusBar barStyle="light-content" backgroundColor='#7D47E0'/>
<Routes/>
</>
);
package
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject"
},
"dependencies": {
"@react-native-community/masked-view": "^0.1.6",
"expo": "~36.0.0",
"expo-location": "~8.0.0",
"react": "~16.9.0",
"react-dom": "~16.9.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-36.0.0.tar.gz",
"react-native-gesture-handler": "~1.5.0",
"react-native-maps": "0.26.1",
"react-native-reanimated": "~1.4.0",
"react-native-safe-area-context": "0.6.0",
"react-native-screens": "2.0.0-alpha.12",
"react-native-web": "~0.11.7",
"react-navigation": "^4.0.10",
"react-navigation-stack": "^2.0.15"
},
"devDependencies": {
"@babel/core": "^7.0.0",
"babel-preset-expo": "~8.0.0"
},
"private": true
}
Profile
import React from 'react';
import { View } from 'react-native'
function Profile() {
return <View/>
}
export default Profile;
Routes.js
import { createAppContainer } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack'
import Main from './Main';
import Profile from './profile';
const Routes = createAppContainer(
createStackNavigator({
Main: {
screen: Main,
navigationOptions: {
title: 'DevRadar',
}
},
Profile: {
screen: Profile,
navigationOptions: {
title: 'Perfil no github',
}
},
}, {
defaultNavigationOptions : {
headerTintColor: '#FFF',
headerStyle: {
backgroundColor: '#7D40E7'
}
},
})
);
export default Routes;
Make the mistake, man
– cpll
I’ll edit and put it on the top
– Daniel Soares
You’re not forgetting to import anything on Main.js?
– cpll
Shouldn’t your useState unstructure an array? You’re trying like an object in its return
– Denis Rudnei de Souza
Bro, it’s the same as the course
– Daniel Soares
It’s not the same, try
const [currentRegion, setCurrentRegion] = useState(null);
, remember that Diego says that the return is an array– Denis Rudnei de Souza
puts, verdaade uma "{ }", valeu ai was not seeing at all
– Daniel Soares