我试图用 Expo React Native 创建一个移动应用程序,但它必须是一个离线应用程序,所以我需要使用本地数据库。在我的应用程序中,三个屏幕的三个文件:一个是主页,在另一个屏幕中,用户可以在本地数据库中保存一些数据,在另一个页面中,用户可以看到保存的数据(作为待办事项应用程序) . 它试图在 AddScreen 文件中创建表,但是当我尝试从 ShowScreen 文件访问它时它不起作用。我正在考虑在另一个文件中创建一个类,在哪里创建表,并创建一个添加数据的函数和另一个读取数据的函数;但我不知道该怎么做。你可以帮帮我吗 ?
- 这是 AddScren 文件的主要部分:
import React, {Component} from 'react';
import { TouchableOpacity, View, Text, StyleSheet } from 'react-native';
import { TextInput } from 'react-native-gesture-handler';
import colors from "../config/colors";
export default class App extends Component {
state = {
nameValue: "",
nicknameValue: "",
}
saveDataHandler = () => {
// Encrypt elements
let ena = this.state.nameValue
let eni = this.state.nicknameValue
//Save data in Database
//Clear TextInput
}
render () {
return (
<View>
<Text style={styles.textInpubLabel} >Name Label</Text>
<TextInput style={styles.textInput} onChangeText={text => this.setState({nameValue: text})} />
<Text style={styles.textInpubLabel} >Nickname Label</Text>
<TextInput style={styles.textInput} onChangeText={text => this.setState({nicknameValue: text})} />
<Text style={styles.textInpubLabel} >Link Label</Text>
<TextInput style={styles.textInput} onChangeText={text => this.setState({linkValue: text})} />
<Text style={styles.textInpubLabel} >Email Label</Text>
<TextInput style={styles.textInput} onChangeText={text => this.setState({emailValue: text})} />
<Text style={styles.textInpubLabel} >Password Label</Text>
<TextInput style={styles.textInput} onChangeText={text => this.setState({passwordValue: text})} />
<TouchableOpacity style={styles.saveButton} onPress={this.saveDataHandler}>
<Text style={styles.saveButtonText} >Save</Text>
</TouchableOpacity>
</View>
);
}
}
- 这是 ShowScreen 文件的主要部分:
import React, {Component} from 'react';
import { Button, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
import { ScrollView } from 'react-native-gesture-handler';
import colors from "../config/colors";
import { setStatusBarStyle } from 'expo-status-bar';
export default class ShowScreen extends Component {
state = {
data: [],
};
searchDataAutomate = () => {
//Find Data In Database and Save it in this.state.data and after show it
}
render() {
return (
<View>
<Text>{this.state.data}</Text>
</View>
);
}
}