Я новичок в React Native и пытаюсь интегрировать свое приложение с базой данных mySQL, расположенной внутри моего хостинг-провайдера (digitalocean.com). Мне удалось получить данные через nodejs и express, но на самом деле они получают данные там, где моя проблема.
Вот как это происходит:
Я создал маршруты. js и вставил следующее:
Примечание: следующие учетные данные являются реальными, но предназначены для чистого тестирования, и я не против обмена.
const express = require('express');
const bodyParser = require('body-parser');
const mysql = require('mysql');
const connection = mysql.createConnection({
host: '134.122.22.176',
user: 'yannb_9',
password: 'yannb_9',
database: 'tiomanGrow'
});
// Starting our app.
const app = express();
connection.connect((err) => {
if (err) {
console.log('Connection error message: ' + err.message);
return;
}
console.log('Connected!')
// Creating a GET route that returns data from the 'users' table.
app.get('/', function (req, res) {
// Connecting to the database.
// Executing the MySQL query (select all data from the 'users' table).
connection.query('SELECT * FROM farmers', function (error, results, fields) {
// If some error occurs, we throw an error.
if (error) throw error;
// Getting the 'response' from the database and sending it to our route. This is were the data is.
res.send(results)
});
});
});
// Starting our server.
app.listen(3000, () => {
console.log('Go to http://localhost:3000/farmers so you can see the data.');
});
До теперь все отлично! Вы можете нажать на http://localhost: 3000 / farm , и вы увидите данные при запуске файла.
Вот где я застрял: я должен был отобразить данные на мое приложение, и я понятия не имею, как это возможно сделать. Я провел несколько исследований и увидел возможное решение, которое не сработало. это фактически дало мне «Сетевой запрос не удался»
import React from "react";
import { View, Text, StyleSheet, TextInput, TouchableOpacity } from "react-native";
import { HeaderImg } from '../components/HeaderImg';
import { Button } from '../components/Button';
export default class DB extends React.Component {
state = {
email: "",
password: "",
errorMessage: null
};
fetchData = async() => {
fetch('http://134.122.22.176:3000/farmers')
.then(response => response.json())
.then(users => console.dir(users))
.catch(error=> console.log(error))
}
render() {
return (
<View style={styles.container}>
<HeaderImg />
<View style={styles.errorMessage}>
{this.state.errorMessage && (
<Text style={styles.error}>{this.state.errorMessage}</Text>
)}
</View>
<Button
onPress={this.fetchData}
/>
</View>
);
}
}
const styles = StyleSheet.create({
});
Есть предложения?