Question

我想将以下代码分离到一个Component文件中，并导入并使用它（例如<ModsListing/>）。

但是，将我的代码放入组件文件并导入并使用它，却出现“未定义”错误。

         {this.props.mods.map(Mod => // Get our mods & loop over them
             <li style={{paddingBottom:'4pt'}} className="list-group-item" key={Mod.id}>
             <Link prefetch href={`/mods/${Mod.id}`}><a>


            {Mod.name}</a></Link>
            {Mod.description}

             </li>

         )}
         </ul>

这是我尝试将其拆分为的组件文件

从“反应”导入React

         {this.props.mods.map(Mod => // Get our mods & loop over them
        <li style={{paddingBottom:'4pt'}} className="list-group-item" key={Mod.id}>
         <Link prefetch href={`/mods/${Mod.id}`}><a>


         {Mod.name}</a></Link>
         {Mod.description}

         </li>

         )}
         </ul>

）;

导出默认的ModListing；

Answer 1

您可以这样尝试

从“反应”导入React

    {this.props.mods&&this.props.mods.map(Mod => // Get our mods & loop over them
   <li style={{paddingBottom:'4pt'}} className="list-group-item" key={Mod.id}>
    <Link prefetch href={`/mods/${Mod.id}`}><a>


    {Mod.name}</a></Link>
    {Mod.description}

    </li>

    )}

）;

导出默认的ModListing；

分离代码时无法从组件读取属性

1 个答案: