TypeError：无法读取未定义0.1的属性“ map”

Question

我正在关注react.js的教程，但遇到这个错误，我不知道该错误的主要原因是什么

感谢所有贡献错误的人：

TypeError：无法读取未定义的属性“ map”

from PyQt5 import QtCore, QtGui, QtWidgets
import pyqtgraph as pg

class Ui_MainWindow(object):
    def setupUi(self, MainWindow):
        MainWindow.setObjectName("MainWindow")
        MainWindow.resize(668, 458)
        self.centralwidget = QtWidgets.QWidget(MainWindow)
        self.centralwidget.setObjectName("centralwidget")
        self.labelx = QtWidgets.QLabel(self.centralwidget)
        self.labelx.setGeometry(QtCore.QRect(50, 20, 581, 231))
        self.labelx.setAutoFillBackground(True)
        self.labelx.setFrameShape(QtWidgets.QFrame.Panel)
        self.labelx.setFrameShadow(QtWidgets.QFrame.Sunken)
        self.labelx.setLineWidth(3)
        self.labelx.setMidLineWidth(3)
        self.labelx.setText("")
        self.labelx.setScaledContents(True)
        self.labelx.setObjectName("labelx")
        self.label_15 = QtWidgets.QLabel(self.centralwidget)
        self.label_15.setGeometry(QtCore.QRect(350, 280, 91, 16))
        self.label_15.setObjectName("label_15")
        self.lineEdit_13 = QtWidgets.QLineEdit(self.centralwidget)
        self.lineEdit_13.setGeometry(QtCore.QRect(230, 280, 113, 20))
        self.lineEdit_13.setObjectName("lineEdit_13")
        self.lineEdit_14 = QtWidgets.QLineEdit(self.centralwidget)
        self.lineEdit_14.setGeometry(QtCore.QRect(230, 310, 113, 20))
        self.lineEdit_14.setText("")
        self.lineEdit_14.setObjectName("lineEdit_14")
        self.label_16 = QtWidgets.QLabel(self.centralwidget)
        self.label_16.setGeometry(QtCore.QRect(350, 310, 91, 16))
        self.label_16.setObjectName("label_16")
        self.pushButton = QtWidgets.QPushButton(self.centralwidget)
        self.pushButton.setGeometry(QtCore.QRect(10, 390, 111, 23))
        self.pushButton.setObjectName("pushButton")
        self.pushButton_2 = QtWidgets.QPushButton(self.centralwidget)
        self.pushButton_2.setGeometry(QtCore.QRect(120, 390, 111, 23))
        self.pushButton_2.setObjectName("pushButton_2")
        self.lineEdit_15 = QtWidgets.QLineEdit(self.centralwidget)
        self.lineEdit_15.setGeometry(QtCore.QRect(440, 280, 113, 20))
        self.lineEdit_15.setText("")
        self.lineEdit_15.setObjectName("lineEdit_15")
        self.label_17 = QtWidgets.QLabel(self.centralwidget)
        self.label_17.setGeometry(QtCore.QRect(560, 280, 91, 16))
        self.label_17.setObjectName("label_17")
        self.pushButton_3 = QtWidgets.QPushButton(self.centralwidget)
        self.pushButton_3.setGeometry(QtCore.QRect(550, 390, 111, 23))
        self.pushButton_3.setObjectName("pushButton_3")
        self.pushButton_4 = QtWidgets.QPushButton(self.centralwidget)
        self.pushButton_4.setGeometry(QtCore.QRect(230, 340, 111, 23))
        self.pushButton_4.setObjectName("pushButton_4")
        MainWindow.setCentralWidget(self.centralwidget)
        self.menubar = QtWidgets.QMenuBar(MainWindow)
        self.menubar.setGeometry(QtCore.QRect(0, 0, 668, 21))
        self.menubar.setObjectName("menubar")
        MainWindow.setMenuBar(self.menubar)
        self.statusbar = QtWidgets.QStatusBar(MainWindow)
        self.statusbar.setObjectName("statusbar")
        MainWindow.setStatusBar(self.statusbar)

        self.retranslateUi(MainWindow)
        self.pushButton_2.clicked.connect(self.lineEdit_13.clear)
        self.pushButton_2.clicked.connect(self.lineEdit_14.clear)
        self.pushButton_2.clicked.connect(self.lineEdit_15.clear)
        self.pushButton_4.clicked.connect(self.plotwid)
        QtCore.QMetaObject.connectSlotsByName(MainWindow)

    def retranslateUi(self, MainWindow):
        _translate = QtCore.QCoreApplication.translate
        MainWindow.setWindowTitle(_translate("MainWindow", "MainWindow"))
        self.label_15.setText(_translate("MainWindow", "Total Expenses"))
        self.label_16.setText(_translate("MainWindow", "Total Income"))
        self.pushButton.setText(_translate("MainWindow", "Add Expenses"))
        self.pushButton_2.setText(_translate("MainWindow", "Cleasr All"))
        self.label_17.setText(_translate("MainWindow", "Total Savings"))
        self.pushButton_3.setText(_translate("MainWindow", "Exit"))
        self.pushButton_4.setText(_translate("MainWindow", "Make Graph"))

    def plotwid(self):

        # define the data
        title = "Savings Calculator"
        t = int(8)
        # y values to plot by line 1
        y = [1, 5, 6, 8, 6, 11, 14, 13, 18, 30]

        # y values to plot by line 2
        y2 = [1, 1, 5, 8, 9, 11, 16, 17, 14, 30]
        x = range(0, 10)

        # create plot window object
        plt = pg.plot()
        # showing x and y grids
        plt.showGrid(x=True, y=True)

        # adding legend
        plt.addLegend()

        # set properties of the label for y axis
        plt.setLabel('left', 'Amount of savings and income', units='y')

        # set properties of the label for x axis
        plt.setLabel('bottom', 'Months to save', units='s')

        # setting horizontal range
        plt.setXRange(0, 12)

        # setting vertical range
        plt.setYRange(0, 1000)

        # setting window title
        plt.setWindowTitle(title)

        # ploting line in green color
        line1 = plt.plot(x, y, pen='g', symbol='x', symbolPen='g',
                         symbolBrush=0.2, name='green')

        # ploting line2 with blue color
        line2 = plt.plot(x, y2, pen='b', symbol='o', symbolPen='b',
                         symbolBrush=0.2, name='blue')

if __name__ == "__main__":
    import sys
    app = QtWidgets.QApplication(sys.argv)
    MainWindow = QtWidgets.QMainWindow()
    ui = Ui_MainWindow()
    ui.setupUi(MainWindow)
    MainWindow.show()
    sys.exit(app.exec_())

我要在主要组件中导入领导者数据

主要组件：

 import { Link } from "react-router-dom";
  function About(props) {
   const leaders = props.leaders.map((leader) => {
       return <p>Leader {leader.name}</p>;
     });

组长的档案：

import React, { Component } from "react";
import Home from "./HomeComponent";
import Contact from "./ContactComponent";
import About from "./AboutComponent";
import Menu from "./MenuComponents";
import Dishdetail from "./DishdetailComponent";
import Header from "./HeaderComponent";
import Footer from "./FooterComponent";
import { Dishes } from "../shared/dishes";
import { Comments } from "../shared/comments";
import { Leaders } from "../shared/leaders";
import { Promotions } from "../shared/promotions";
import { Switch, Route, Redirect } from "react-router-dom";

class Main extends Component {
  constructor(props, context) {
    super(props, context);

    this.state = {
      dishes: Dishes,
      comments: Comments,
      promotions: Promotions,
      leaders: Leaders,
    };
  }

  render() {
    const HomePage = () => {
      return (
        <Home
          dish={this.state.dishes.filter((dish) => dish.featured)[0]}
          promo={this.state.promotions.filter((promo) => promo.featured)[0]}
          leader={this.state.leaders.filter((leader) => leader.featured)[0]}
        />
      );
    };

    const DishWithId = ({ match }) => {
      return (
        <Dishdetail
          dish={this.state.dishes.filter((dish) => dish.id === parseInt(match.params.dishId, 10))[0]}
          comments={this.state.comments.filter((comment) => comment.dishId === parseInt(match.params.dishId, 10))[0]}
        />
      );
    };
    return (
      <div>
        <Header />
        <Switch>
          <Route path="/home" component={HomePage} />
          <Route exact path="/menu" component={() => <Menu dishes={this.state.dishes} />} />
          <Route path="/menu/:dishId" component={DishWithId} />
          <Route exact path="/contactus" component={Contact} />
          <Route exact path="/aboutus" component={About} />
          <Redirect to="/home" />
        </Switch>
        <Footer />
      </div>
    );
  }
}

export default Main;

这个社区很棒

Answer 1

您正在尝试迭代props.leaders的槽undefined，它必须是数组。在您的情况下，似乎缺少属性，这就是导致此问题的原因。

需要将leaders组件中的props传递给<Route />，如下：

<Route exact path="/aboutus" component={<About leaders={this.state.leaders} />} />