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);
  }
}

使用react native在iOS设备上存储数据

1 个答案: