gpt4 book ai didi

javascript - typescript 错误 : Property 'children' does not exist on type '{ children?: ReactNode; }'

转载 作者:行者123 更新时间:2023-12-05 03:40:32 27 4
gpt4 key购买 nike

https://www.emgoto.com/react-search-bar/

我正在从上面的链接中实现搜索栏。
但是我得到了一个 typescript 错误,我试图匹配类型,但它没有用..

主页.tsx

const [searchQuery, setSearchQuery] = useState(query || '');

return(
<Search searchQuery={searchQuery} setSearchQuery={setSearchQuery} />
);

搜索.tsx

import React, { FC } from 'react';

const Search: FC = ({ searchQuery, setSearchQuery }) => { // error!
return (
<form action="/" method="get">
<label htmlFor="header-search">
<span className="visually-hidden">Search blog posts</span>
</label>
<input
value={searchQuery}
onInput={(e) => setSearchQuery(e.target.value)}
type="text"
id="header-search"
placeholder="Search blog posts"
name="s"
/>
<button type="submit">Search</button>
</form>
);
};

export default Search;

错误:

  1. 属性“searchQuery”在类型“{ children?: ReactNode; 上不存在” }'.ts(2339)
  2. 属性“setSearchQuery”在类型“{children?: ReactNode; }'.ts(2339)

最佳答案

来自 CRice 的评论

React.FC 是一个通用类型,它接受 props 的类型作为它的参数。您需要包括 Prop 类型。示例:

const Search: FC<{searchQuery: string, setSearchQuery: (new_query: string) => void}> = ... 

关于javascript - typescript 错误 : Property 'children' does not exist on type '{ children?: ReactNode; }' ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/68087257/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com