首页 > 解决方案 > ReactJs Newbie 期待一个赋值或函数调用,而是看到一个表达式 no-unused-expressions

问题描述

所有,我在 react js 应用程序中收到以下错误。我是 React 的新手,并试图创建一个示例应用程序并遇到这个问题:期望一个赋值或函数调用,而是看到一个表达式 no-unused-expressions..任何关于发生了什么的指针.....示例代码

import React, { useState } from "react";
import "./App.css";
import Post from "./Post";

function App() {
  const [posts, setPosts] = useState([
    {
      username: "kmangal",
      caption: "wow this is working and cool",
      imageUrl: "{require('./images/antoers.jpg')}",
    },
    {
      username: "ROHINI",
      caption: "Rohie wow this is working and cool",
      imageUrl: "{require('./images/antoers.jpg')}",
    },
    {
      username: "GEETA",
      caption: "GEETA wow this is working and cool",
      imageUrl: "{require('./images/antoers.jpg')}",
    },
  ]);

  return (
    <div className="App">
      <div className="app_header">
        <img className="app_header" src={require("./images/logo.png")} alt="" />
      </div>
      <h1>hellow this is khemlall</h1>

      {posts.map((post) => {
        <Post username={post.username} />;
      })}
      <Post
        username="kmangal"
        caption="wow this is working and cool"
        imageUrl={require("./images/antoers.jpg")}
      />
      <Post
        username="Rohini"
        caption="rohini mrry khemlall"
        imageUrl={require("./images/prot1.png")}
      />
      <Post
        username="geeta"
        caption="she is my sisster"
        imageUrl={require("./images/psot2.jpg")}
      />
    </div>
  );
}

export default App;

标签: reactjsreact-redux

解决方案


{posts.map((post) => {
  <Post username={post.username} />;
})}

此地图功能不返回任何内容。在以下位置添加 return 语句:

{posts.map((post) => {
  return <Post username={post.username} />;
})}

或者通过删除大括号来做箭头函数的缩短版本

{posts.map((post) => (
  <Post username={post.username} />
))}

推荐阅读