reactjs - 打字稿错误：不可分配给类型“IntrinsicAttributes”。“IntrinsicAttributes”类型上不存在属性“子项”

Question

我创建了一个弯曲的容器，我正在尝试在我的项目中使用它，但是报告了一个错误，我不知道如何解决它，有没有人有什么想法？

import Image from "next/image";
import curveImage from "/public/curve.png";
import curveReverseImage from "/public/curve-reverse.png";
import curveImageBlack from "/public/curve-black.png";
import curveReverseImageBlack from "/public/curve-reverse-black.png";

type Props = {
  children: JSX.Element;
  curveTop?: "white" | "black" | "none";
  curveBottom?: "white" | "black" | "none";
  [defaultParam: string]: any;
};

export default function CurvedContainer({
  children,
  curveTop = "white",
  curveBottom = "white",
  ...rest
}: Props) {
  return (
    <div {...rest} className={`${rest.className} flex flex-col`}>
      {curveTop != "none" && (
        <div className="curveTop" style={{ marginTop: -1 }}>
          <Image
            height="250"
            alt="top image"
            src={
              curveTop == "white" ? curveReverseImage : curveReverseImageBlack
            }
          />
        </div>
      )}

      {children}

      {curveBottom != "none" && (
        <div className="curveTop -mb-2">
          <Image
            height="250"
            alt="top image"
            src={curveBottom == "white" ? curveImage : curveImageBlack}
          />
        </div>
      )}
    </div>
  );
}

我不知道为什么不幸出现这个错误。如果有人可以帮助我，那真是太棒了！

 <Container
    className="none"
    curveTop="white"
    curveBottom="none"
  >
    <div className="flex flex-row items-center justify-center p-8">
      <a href="#" className={`bg-black text-white font-bold
         tracking-wider text-sm text-center uppercase rounded-full px-8 py-2 shadow-lg `}
        type="button">
        Saiba Mais
      </a>
    </div>
 </Container>

这里的错误：

标签： reactjstypescriptreact-propschildren

Answer 1

最好将React.ReactNode类型用于反应元素，因为它也适用于元素数组。只需更改您的类型

children: JSX.Element;

至React.ReactNode