Javascript 为什么列表没有'；你没有出现在页面上吗？我的React Redux（Api）应用程序中有哪些错误？如何修复它们？

首先，我在React.js上创建了一个小应用程序。使用

fetch

方法，我获取API

以下是我的应用程序的主要文件：

js：（行动）

airplanes.js:（减速器）

index.js（减速机）：

---

你不想给这个电话发送一些参数吗

this.props.showAirplanes（）

---

它似乎有两个参数：state和action，虽然state似乎已经有了它的默认值，但是首先，您应该像这样使用

createStore

函数：

const initialData = {}; // whatever you want as initial data
const store = createStore(reducers, initialData, applyMiddleware(thunk));

然后将其传递给提供商

<Provider store={store}>
 {...}
</Provider

为此：

fetch("https://api.iev.aero/api/flights/25-08-2019")
    .then(res => res.json())
    .then(response => {
      dispatch({ type: SHOW_AIRPLANES, payload: response.body.departure });
    });

请注意，我还更改了需要从响应中解析的值

在

App.js

组件中，您需要创建一个构造函数，并将

renderAirplaneList

函数绑定到

this

// Inside the App class
constructor(props) {
  super(props);

  this.renderAirplaneList = this.renderAirplaneList.bind(this);
}

最后（我希望我没有错过任何其他东西），您将

App.js

组件中的状态映射到

{airplanes:state.airplanes.list}

，因此您希望组件中的道具名称是

props.airplanes

renderAirplaneList() {
    if (!this.props.airplanes.length) {
        return null;
    }

    const arr = this.props.airplanes || [];

    return arr.map(airplane => {
      return (
        <tr key={airplane.id}>
          <td>{airplane.ID}</td>
          <td>{airplane.term}</td>
          <td>{airplane.actual}</td>
          <td>{airplane["airportToID.city_en"]}</td>
        </tr>
      );
    });
  }

renderAirplaneList（）{
如果（！this.props.airplanes.length）{
返回null；
}
const arr=this.props.airplanes | | |[]；
返回arr.map（飞机=>{
返回(
{planet.ID}
{planet.term}
{飞机实际飞行}
{飞机[“airportToID.city_en”]}
);
});
}

请确保您仔细阅读了React和Redux的文档，他们拥有您需要的所有信息

---

祝你好运。

非常感谢！我也祝你好运！还想问一下我们为什么在这里写作：

conststore=createStore（reducer、initialData、applyMiddleware（thunk））

word

reducer

和not:

rootReducer

？@vrm111这是您的默认导出

rootReducer

，一旦您将默认导出到另一个模块，您可以给它任何您想要的名称。您这样做：

从“/reducers”导入减缩器因此您选择的名称是
减速器
。
fetch("https://api.iev.aero/api/flights/25-08-2019").then(response => {
      dispatch({ type: SHOW_AIRPLANES, payload: response.data });
    });

fetch("https://api.iev.aero/api/flights/25-08-2019")
    .then(res => res.json())
    .then(response => {
      dispatch({ type: SHOW_AIRPLANES, payload: response.body.departure });
    });

// Inside the App class
constructor(props) {
  super(props);

  this.renderAirplaneList = this.renderAirplaneList.bind(this);
}

renderAirplaneList() {
    if (!this.props.airplanes.length) {
        return null;
    }

    const arr = this.props.airplanes || [];

    return arr.map(airplane => {
      return (
        <tr key={airplane.id}>
          <td>{airplane.ID}</td>
          <td>{airplane.term}</td>
          <td>{airplane.actual}</td>
          <td>{airplane["airportToID.city_en"]}</td>
        </tr>
      );
    });
  }