React/JS prop 用冒号分隔

Question

Search 组件的 props 中 { placeholder }: { placeholder: string } 之间的冒号是什么意思？这也显示在主页面组件的代码中......

是说预期的占位符属性是字符串数据类型吗？或者是某种解构？

export default function Search({ placeholder }: { placeholder: string }) {
  const searchParams = useSearchParams();
  const pathname = usePathname();

  return (
      <input
        className="red"
        placeholder={placeholder}
        onChange={(e) => {
          handleSearch(e.target.value)
        }}
      />
  );
}

export default async function Page({
  searchParams,
}: {
  searchParams?: {
    query?: string;
    page?: string;
  }

}) {
  const query = searchParams?.query || "";
  const currentPage = Number(searchParams?.page) || 1;
  
  return (
     <>
       <Search placeholder="Search invoices..." />
       <Suspense key={query + currentPage} fallback={<InvoicesTableSkeleton />}>
          <Table query={query} currentPage={currentPage} />
        </Suspense>
     </>

  );
}

Answer 1

那就是 Typescript，Javascript 的超集，添加了管理类型的语法，这是 JS 中不可用的功能。