Why I am getting this error: Error: failed to process internal error: entered unreachable code: assign property in object literal is invalid

Question

在为 JSX 文件编写代码时出现错误：

错误：无法处理内部错误：输入无法访问的代码：对象字面量中的赋值属性无效

我找不到任何解决方案。我在网上搜索，发现类似的问题没有答案。

你能至少告诉我为什么我得到它吗？

index.js


import CardsContainer from "../components/layout/CardsContainer";
import Nav from "../components/layout/side-nav/Nav";


const cards = [
  {id = 1, lake = "Nill", gender = "Male", image = "3"},
  {id = 2, lake = "Nill", gender = "Male", image = "3"},
  {id = 3, lake = "Nill", gender = "Male", image = "3"},
  {id = 4, lake = "Nill", gender = "Male", image = "3"},
];

export default function Home() {
  
  return (
    <Fragment>
      <Nav/>
      <CardsContainer cards={cards}/>
    </Fragment>
  );
}

CardsContainer.js

export default function CardsContainer(props) {
  const cards = props.cards;

  return (
    <div>
      {cards.map((card) => {
        return (<Card item={card} />);
      })}
    </div>
  );
}

Card.js

import Image from "next/image";
import Link from "next/link";

export default function Card(props) {
  
  const id = props.item.id;
  const lake = props.item.lake;
  const gender = props.item.gender;
  const image = props.item.image;

  return (
    <Link href={`/item/${id}`}>
      <a>
        <div id="card-with-image">
          <div>
            <Image
              src={`/images/items/${image}.jpg`}
              alt="Tumbnail Image"
              width="450"
              height="150"
            />
          </div>
          <div>
            <h1>Lake:</h1>
            <p>
              {lake}
            </p>
          </div>
          <div>
            <h1>Gender:</h1>
            <p>
              {gender}
            </p>
          </div>
        </div>
      </a>
    </Link>
  );
}```

Answer 1

你在卡片中构建对象的方式是错误的。你应该这样写：

const cards = [
  {id : 1, lake : "Nill", gender : "Male", image : "3"},
  {id : 2, lake : "Nill", gender : "Male", image : "3"},
  {id : 3, lake : "Nill", gender : "Male", image : "3"},
  {id : 4, lake . "Nill", gender : "Male", image : "3"},
];

对象由键和值组成。

Answer 2

对象（您的 const cards）应该始终使用冒号而不是等号构建 https://javascript.info/object#literals-and-properties

Why I am getting this error: Error: failed to process internal error: entered unreachable code: assign property in object literal is invalid

Why I am getting this error: Error: failed to process internal error: entered unreachable code: assign property in object literal is invalid

javascript

jsx

reactjs