javascript - خطای TypeScript: نوع '.....' قابل انتساب به نوع 'IntrinsicAttributes & Number' نیست

تازهکار در TypeScript هستم، سعی میکنم یک کد JS را به TS منتقل کنم و خطا دریافت میکنم

[ts]
Type '{ current: number; total: number; }' is not assignable to type 
'IntrinsicAttributes & Number'.
  Type '{ current: number; total: number; }' is not assignable to type 
'Number'.
Property 'toFixed' is missing in type '{ current: number; total: number; }'.
(JSX attribute) current: number

تابع

function Header(current: number, total: number, question: DEEP_QUESTION){
//  console.log("Header " + current.toString());
  return (
      <div> 
        <StepBar current={current} total={total} />
        <SurveyTheme theme={question.theme} />
      </div>
  )
  //refresh();
}

پیامها در پارامترهای تماس StepBar ظاهر میشوند. امضاهای StepBar

function StepBar(current: number, total: number) {

این در جاوااسکریپت کار میکند

نظری داری؟

پاسخ شماره ۱

StepBar باید یک شیء props با اعضایی به نامهای current و total بپذیرد.

میتوانی چیزی شبیه به این را امتحان کنی:

function StepBar(props: {current: number, total: number}) { ... }

پاسخ شماره ۲

شما میتوانید از جنریک React.StatelessComponent برای ارسال نوعهای پراپ خود به صورت زیر استفاده کنید:

interface IHeaderProps {
    current: number;
    total: number;
 }

const Header:React.StatelessComponent<IHeaderProps> =  (props) => {
  return (
    ...
  )
}