微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

在 Expo React Native 中使用 SQLite

如何解决在 Expo React Native 中使用 SQLite

我试图用 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,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>
            
        );
    }
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。