javascript - 在 React Native 中为 AsyncStorage 在 try{}catch{} block 中放入什么

Question

我是 React Native 和一般数据库的新手。我目前正在尝试制作一个获取用户当前位置(纬度和经度)的类，并将其转换为谷歌地图的 url 以将其存储在数据库中。但是，每当我尝试编译我的代码时，我都会收到错误消息。它还向我显示了 storeData() 的错误

SyntaxError: C:\Users\xymlt\OneDrive\Desktop\not-arbit\components\Geolocation.js: Missing catch or finally clause (57:3)

  55 | 
  56 |  storeData = async () => {
> 57 |    try {
     |    ^
  58 |      await AsyncStorage.setItem
  59 |    }
  60 |  }

我尝试搜索有关如何显示数据的 AsyncStorage 示例，最具体地说，如何使用 try catch block 。我正在查看 https://github.com/react-native-community/react-native-async-storage/blob/master/docs/API.md#getAllKeys 中的示例但它没有提供 try catch block 应该是什么样子的任何具体示例。请帮忙。

import React from 'react';
import {View, Text,  StyleSheet, Image , PermissionsAndroid, Platform} from 'react-native';
import AsyncStorage from '@react-native-community/async-storage';

export default class Carpool extends React.Component {
  state = { // set current state
    currentLongitude: null, //Initial Longitude
    currentLatitude: null, //Initial Latitude
 }
 componentDidMount = () => {
  var that = this;

  //checl for system permissions
  if(Platform.OS === 'ios'){
    this.callLocation(that);
  }else{
    async function requestLocationPermission() {
      try {
        const granted = await PermissionsAndroid.request(
          PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,{
            'title': 'Location Access Required',
            'message': 'This app needs to access your location'
          }
        )
        if (granted === PermissionsAndroid.RESULTS.GRANTED) {
          that.callLocation(that);
        } else {
          alert("Permission Denied");
        }
      } catch (err) {
        alert("err",err);
        console.warn(err)
      }
    }
    requestLocationPermission();
  }    
 }

 callLocation(that){ //function gives current location
    navigator.geolocation.getCurrentPosition(
       (position) => {
          const currentLongitude = JSON.stringify(position.coords.longitude); //getting the Longitude from the location json
          const currentLatitude = JSON.stringify(position.coords.latitude); //getting the Latitude from the location json
          this.storeData(currentLatitude, currentLongitude);
          that.setState({ currentLongitude:currentLongitude }); //Setting state Longitude to re re-render the Longitude Text
          that.setState({ currentLatitude:currentLatitude }); //Setting state Latitude to re re-render the Longitude Text
       },
       (error) => alert(error.message),
       { enableHighAccuracy: true, timeout: 20000, maximumAge: 1000 }
    );
 }

 componentWillUnmount = () => {
    navigator.geolocation.clearWatch(this.watchID);
 }

storeData = async (lat, long) => { //return a link instead
    var url = 'geo:0,0?q=' + 'lat,long';
    try {
     await AsyncStorage.setItem('urlOne', JSON.stringify(url));
   } catch (error) {
        alert("error",error);
        console.warn(error)
   }
 }

 getData = async(key) => {
     try {
         const value = await AsyncStorage.getItem(key)
         if(value !== null) {
            return(JSON.parse(url));
         }
     } catch(error) {
        alert("error",error);
        console.warn(error)
     }
 }

 render() {
    return (
       <View style = {styles.container}>
          <Text style = {styles.boldText}>
             You are Here
          </Text>
          <Text style={{justifyContent:'center',alignItems: 'center',marginTop:16}}>
            Longitude: {this.state.currentLongitude}
          </Text>
          <Text style={{justifyContent:'center',alignItems: 'center',marginTop:16}}>
            Latitude: {this.state.currentLatitude}
          </Text>
          {this.getData('url')}

       </View>
    )
 }
}
const styles = StyleSheet.create ({
 container: {
    flex: 1,
    alignItems: 'center',
    justifyContent:'center',
    marginTop: 50,
    padding:16,
    backgroundColor:'white'
 },
 boldText: {
    fontSize: 30,
    color: 'red',
 }
})

Answer 1

try block 必须始终跟在 catch 或 finally block 之后。

try{
    //code which may potentially have an error.
}
catch(error){
    //code which will only run if an error happened in the try block.
    //the catch statement has an argument which will have the error. I have called it error in this example.
    console.log(error); //simply prints the error information, but you can do anything with it.
}

finally block 也是一种选择。无论 try block 的结果如何，它都会运行。

try{
    //code that can error
}
finally{
    //code which will run after the try block whether an error happens or not.
}

可以同时拥有catch和finally

try{
    //code which may potentially have an error.
}
catch(error){
    //code which will only run if an error happened in the try block.
}
finally{
    //code which will run after the try and catch blocks whether an error happens or not.
}

更多信息:
w3schools
Mozilla Developer Network