“{}”类型中缺少属性“opacity”，但“LoaderProps”类型中需要属性“opacity”

Question

我正在使用 TypeScript(tsx)

 import React from "react";

  interface LoaderProps {
   opacity: number;
  }

  const Loader: React.FC<LoaderProps> = ({ opacity }) => {
   return (
   <div className={`fixed top-0 bottom-0 left-0 right-0 flex 
    justify-center items-center bg-white bg-opacity-${opacity}`}>
</div>

并将其导入到另一个文件

import React from 'react';
import Loader from './Loader';

const Main: React.FC = () => {
    return (
      <div>
        <Loader opacity={75} />
     </div>
   );
}

export default Main;

这给了我这个错误

TS2741：“{}”类型中缺少属性“opacity”，但“LoaderProps”类型中需要属性“opacity”。

Answer 1

您遇到的错误消息表明您使用 Loader 组件的组件中缺少 opacity 属性。让我们确保您正确传递了 opacity 属性。

首先，让我们检查一下Loader组件：