时间戳

首页 > 解决方案 > 使用组件显示数组行

node.js - 使用组件显示数组行

问题描述

新手破解我的方式。我正在尝试从数组中提取行并将它们显示在屏幕上。我填充了数组，下面的代码片段有效：

return (
        buildings.map((building) => {
          return <div className="col-md-9"> 
             {building.name}

但是当我尝试在语句中使用一个组件时，我得到一个错误。这不起作用：

return (
        buildings.map((building) => {
          return <div className="col-md-9"> 
             <Building building={building.name}/>

建筑组件在这里：

import React from 'react'

function Building({building}) {
  return (
    <div className="row">
      <h1>{building.name}</h1>
    </div>
  )
}

export default Building

我得到的错误在这里：

src/screens/Homescreen.js 第 34:15 行：“建筑”未定义 react/jsx-no-undef

如有必要，我可以提供更多详细信息。我想我遗漏了一些明显的东西，但我现在被困住了，所以感谢您的帮助。

标签： node.jsreactjs

解决方案

首先检查您是否正在导入Building组件。其次，<Building building={building.name}/>您正在传递 building 的 name 属性，然后在 Building 组件中，尝试访问该 name 属性。这应该更改为<Building building={building}/>. 修复这些以查看问题是否仍然存在。

推荐阅读