Question

我正在努力理解“ AsyncStorage”。对我来说，这很难理解，因为我现在是一名初级工程师。但是我想知道如何在本地设备用户内部保存一些数据。

我在哪里可以使用

 _storeData = async () => {
   try {
   await AsyncStorage.setItem('@MySuperStore:key',  'I like to save 
    it.');
  } catch (error) {
   // Error saving data
 }
}

和

  _retrieveData = async () => {
   try {
   const value = await AsyncStorage.getItem('TASKS');
   if (value !== null) {
    // We have data!!
    console.log(value);
  }
 } catch (error) {
   // Error retrieving data
 }
}

顺便说一句，在我的App中，我尝试制作一些表单，供用户输入一些数据，但是每个用户都可以将这些数据保存在每个表单中，然后，如果用户之前要更改文档用户输入，则可以对其进行更改。

除此之外，用户数据位于Firebase Firestore上。

Answer 1

您可以使用此示例来实现“首次运行开放模式应用程序”

class ModalExample extends Component {

  constructor(props) {
    super(props)
    state = {
      modalVisible: false,
    };
  }

  setModalVisible(visible) {
    this.setState({modalVisible: visible});
  }

  checkIfNeedOpenModal = async () => {
    try {
      const isFirstOpen = await AsyncStorage.getItem('IS_FIRST_OPEN');
      if (!isFirstOpen || isFirstOpen !== 'true') { // Check if key IS_FIRST_OPEN doesnt have value or not 'true'
        // isFirstOpen is null or not 'true' so this is first time app open

        this.setModalVisible(true)
      }
     } catch (error) {
       // Error retrieving data
     }
  }

  saveModalOpen = async () => {
    try {
      await AsyncStorage.setItem('IS_FIRST_OPEN', 'true');
    } catch (error) {
      // Error saving data
    }
  }
  onModalShow = () => {
    this.saveModalOpen()
  }

  componentDidMount() {
    this.checkIfNeedOpenModal()
  }

  render() {
    return (
      <View style={{marginTop: 22}}>
        <Modal
          animationType="slide"
          transparent={false}
          visible={this.state.modalVisible}
          onShow={this.onModalShow}
          onRequestClose={() => {
            Alert.alert('Modal has been closed.');
          }}>
          <View style={{marginTop: 22}}>
            <View>
              <Text>Hello World!</Text>

              <TouchableHighlight
                onPress={() => {
                  this.setModalVisible(!this.state.modalVisible);
                }}>
                <Text>Hide Modal</Text>
              </TouchableHighlight>
            </View>
          </View>
        </Modal>
      </View>
    );
  }
}

（React Native）模式会在用户首先打开此应用时仅向每个用户显示一次

1 个答案: