reactjs - Bindningselementet 'string' har implicit typen 'any'

Jag har den här typen av kod:

function Child( { name: string } ) {
  return (
    <div>
      {name ? (
        <h3>
          The <code>name</code> in the query string is &quot;{name}
          &quot;
        </h3>
      ) : (
        <h3>There is no name in the query string</h3>
      )}
    </div>
  );
}

och jag fick:

Jag försökte på många sätt att skicka namnet name bokstavligt men TypeScript klagar alltid, någon idé om hur man gör TypeScript glad?

Koden är hämtad från: https://reactrouter.com/web/example/query-parameters

Svar #1

function Child(name: { name: String}) { ...
/// ^ this is not typing the props, 
/// it's typing the first parameter called name

För att korrekt skriva React-propsen måste du göra så här.

function Child({name}: {name: string}) { ...

Du kanske också vill använda typen string istället för wrappern String eftersom de inte är samma sak. Det rekommenderas att använda string när det är möjligt. Kolla in denna fråga för mer information om det.

Enligt felet returnerar också funktionen query.get("name") en nollbar string. Du kanske vill göra en typomvandling innan du använder den för att säkerställa att den inte är null.

<Child name={query.get("name") as string} />

Relaterade artiklar