网络请求失败错误 React Native，使用 Flask Python 作为后端答案

【问题标题】：Network Request Failed Error React Native, using Flask Python as BackEnd网络请求失败错误 React Native，使用 Flask Python 作为后端
【发布时间】：2021-06-29 00:22:40
【问题描述】：

使用邮递员，后端似乎可以取回正确的数据，但是当我将其放入 fetch 中时，组件不会重新呈现状态，并且还会给我一个黄色错误，即网络请求失败。后端由 Flask Python 制成，前端使用 Expo CLI 和 android 模拟器，我查了以前的问题，发现有人说模拟器和机器没有连接，我通过远程/本地 ip ex 解决了这个问题: 192.168.1.... 但它仍然返回网络请求失败。

import React, { useEffect, useState } from "react";
import { ScrollView, View, TouchableOpacity, Text } from "react-native";
import { connect } from "react-redux";
import * as actions from "../src/actions";
import EarningsBar from "./EarningsBar";

const DayCalendar = (props) => {
  const [isLoaded, setisLoaded] = useState(false);
  useEffect(() => {
    props.loadStock("daily");
    if (Object.keys(props.dailyStocks).length > 0) {
      setisLoaded(true);
      console.log(props.dailyStocks);
    }
  }, []);
  return (
    <ScrollView nestedScrollEnabled={true}>
      {isLoaded === true &&
        props.dailyStocks.time.map(
          ({ companyshortname, epsactual, epsestimate, ticker }, index) => {
            return (
              <EarningsBar
                key={index}
                companyName={companyshortname}
                companyAbbrev={ticker}
                companyEPS={epsestimate}
                companyRev={"$3.28"}
                companyActualEPS={epsactual}
                companyActualRES={"$5.66"}
                companyGrowthEPS={"103.3%"}
                companyGrowthRev={"83.8%"}
                arrow={"good"}
              />
            );
          }
        )}
    </ScrollView>
  );
};

const mapStateToProps = (state) => {
  return {
    dailyStocks: state.calendar.daily,
  };
};

export default connect(mapStateToProps, actions)(DayCalendar);

这是日历组件这是动作函数

export const loadStock = (stock) => {
  return (dispatch) => {
    try {
      fetch(`http://192.168.1.13:3000/${stock}stock`)
        .then((response) => {
          return response.json();
        })
        .then((data) => {
          dispatch({ type: "LOAD_STOCKS", payload: { stock, data } });
        });
    } catch (error) {
      console.log(error);
    }
  };
};

我的减速器状态/和开关情况

export const initialLoginState = {
  users: [],
  searchedStocks: [],
  calendar: {
    daily: [],
    weekly: [],
    monthly: [],
  },
  stocks: [],
  searchTerm: null,
  isLoading: true,
  user_id: null,
  username: null,
  password: null,
  confirmPassword: null,
  email: null,
  birthdate: null,
  question: null,
  answer: null,
  userToken: null,
  isValidUser: true,
  isValidPassword: true,
};

export default (prevState = initialLoginState, action) => {
  switch (action.type) {
  case "LOAD_STOCKS":
      return {
        ...prevState,
        calendar: {
          [action.payload.prop]: action.payload.value,
        },
      };
    default:
      return {
        ...prevState,
      };
   }
};

如果您想查看完整的 repo，我已将其链接在下面。一段时间以来，我一直在努力解决这个问题，我只需要一个新的视角来看待它，非常感谢您抽出宝贵的时间。 https://github.com/JayPankajPatel/EarningsWhisper

【问题讨论】：

如果您想使用我们正在使用的 api 的 python 重新制作后端，我忘了提到我们正在使用 yahoo 收益 api 调用收益日历。

标签： react-native react-redux fetch react-native-android fetch-api

【解决方案1】：

打开CMD并运行ipconfig，然后复制你的IP地址

在你的烧瓶代码中，让我们说 app.py

将 app.run() 更改为

app.run(host=你的ip地址)

【讨论】：