反応するネイティブを使用してiOSデバイスにデータを保存する

Question

React Nativeを初めて使用し、簡単なiOSアプリケーションを作成しようとしています。このアプリにはクリック時のボタンがあり、デバイスのクリックのタイムスタンプをファイルに保存する必要があります。

React NativeにはAsyncStorageというAPIがありますが、これを使用している間にエラーが発生しています。ネット上のいくつかのサイトからコードをコピーしました。

誰かがこのAPIを使用するように案内できますか？

これは私の全体のコードです：エラーについては

import React, {Component} from 'react'; 
import { StyleSheet, Text, View, TextInput, AsyncStorage } from 'react-native'; 

export default class App extends Component{ 
    state = { 
    'name': '' 



} 

    componentDidMount =() => AsyncStorage.getItem('name').then((value) => this.setState({'name': value})) 

    setName = (value) => { 
    AsyncStorage.setItem('name': value); 
    this.setState({'name': value}); 
    } 

    render() { 
    return (
     <View style={styles.container}> 
     <TextInput style = {styles.textInput} autoCapitalize = 'none' 
       onChangeText = {this.setName}/> 
     <Text> 
      {this.state.name} 
     </Text> 
     </View> 
    ); 
    } 
} 

const styles = StyleSheet.create({ 
    container: { 
     flex: 1, 
     alignItems: 'center', 
     marginTop: 50 
    }, 
    textInput: { 
     margin: 15, 
     height: 35, 
     borderWidth: 1, 
     backgroundColor: '#7685ed' 
    } 
}); 

、私はiOSのコードを起動したとき、私は赤い画面を取得しています。私が見ることができる構文エラーはありません。

ありがとうございます。

Answer 1

あなたが直面している正確な問題を詳しく述べるのは難しいとは言い難いですが、次のうちのいくつかはあなたを助けるかもしれないと思いますか？

ああ、私はあなたがいくつかのコードを投稿したのを見ています。状態を定義するコンストラクタも必要です。私のコードの下にそれを追加しました。

私は専門家ではありませんのでご注意ください。エラーをお許しください。

import { 
    AsyncStorage, 
} from 'react-native'; 

class myComponent extends React.Component{ 

    constructor(props) { 
    super(props); 
    this.state = { 
     data: null 
    }; 
    } 

    componentDidMount() { 
    this._loadInitialState().done(); 
    } 

    _someFunction() { 
    var myData = 123; 
    saveItemLocally('data', myData); 
    } 

    async _loadInitialState() { 
    try { 
     // get localy stored data 
     var dataStored = await AsyncStorage.getItem('data'); 
     if (dataStored!==null) { 
     this.setState({ 
      data: dataStored 
     }); 
     } 
    } catch (error) { 
     //didn't get locally stored data 
     console.log(error.message); 
    } 
    } // end _loadinitialstate 

    render() { 
    //your render function 
    return (
    ); 
    } 
} // end of your component 

async function saveItemLocally(item, value) { 
    try { 
    await AsyncStorage.setItem(item, value); 
    } catch (error) { 
    console.log('AsyncStorage error: ' + error.message); 
    } 
}