Question

使用Typescript将原型添加到React组件的语法是什么？以下内容无效：

import React from "react";

type Props = {
  text: string;
  number: number;
};

function TextInput<Props>({ text, number }) {
  return (
    <div style={{ border: "1px solid gold" }}>
      <p>TEXT: {text}</p>
      <p>NUMBER: {number}</p>
    </div>
  );
}

export default TextInput;

Answer 1

您需要定义参数的类型（恰好是参数的分解）。

import React from "react";

type Props = {
  text: string;
  number: number;
};

function TextInput({ text, number }: Props) {
  return (
    <div style={{ border: "1px solid gold" }}>
      <p>TEXT: {text}</p>
      <p>NUMBER: {number}</p>
    </div>
  );
}

export default TextInput;

您要定义的是带有通用类型参数Props的函数，这是非常不同的东西。

用于React组件的Typescript prop类型的语法？

1 个答案: