英文:
Have I been using `ReactElement` in the correct way?
问题
我已经用以下方式构建了一个应用程序:
export const SomeComponent = (props: SomeComponentProps): React.ReactElement => {
return (
<>
<div>some content</div>
</>
)
}
然而,现在我在Google上搜索后,似乎这不是一个"component",而是一个"element"。
我有些困惑,不确定我是否正确构建了我的应用程序。我的所有TSX/JSX文件都是这样设置的,使用"ReactElement",但网上很多结果都显示了一些称为"components"的东西,其中包含一个"render"方法。
我的应用程序中的所有组件/元素是否都应该以React.ReactElement
开头,还是我完全做错了?
英文:
I’ve built an app with "components" that all begin like this:
export const SomeComponent = (props: SomeComponentProps): React.ReactElement => {
return (
<>
<div>some content</div>
</>
)
}
However now I’ve been Googling and it would seem as though this is not a "component" but an "element".
I’m having some difficulty telling if I’ve built my app correctly, all of my TSX/JSX files are set up like this and use "ReactElement" but an lot of results on the web show me things called "components" with a render method in them.
Should all of my components/elements in my app start with React.ReactElement
or have I done this entirely wrong?
答案1
得分: 1
不需要在 React 组件中输入返回类型。只需删除 : React.ReactElement
部分,然后您可以继续。
英文:
There is no need to type the return type of React components. So just remove the : React.ReactElement
part and you're good to go.
答案2
得分: -1
第一个问题
React.ReactNode
包括了react
可以提供的一切。它可以是字符串,数字,布尔值,null,undefined,片段(fragment),传送门(portal),React元素(ReactElement),或ReactNode的数组。
因此,如果你查看ReactNode
的类型,它会看起来类似于以下内容。
type ReactNode = ReactChild | ReactFragment | ReactPortal | boolean | null | undefined;
第二个问题
答案是React.memo
,useMemo
,和React.memo
是不同的,请注意区分。
没有人可以比文档更好地解释给你,所以请参考新文档:https://beta.reactjs.org/reference/react/memo
英文:
First Question
React.ReactNode
is everything that react
can offer. It can be string, number, boolean, null, undefined, fragment, portal, ReactElement, or an array of the ReactNode.
so If you look into the type of ReactNode
, it will look something like below.
type ReactNode = ReactChild | ReactFragment | ReactPortal | boolean | null | undefined;
Second Question
The answer is React.memo
, useMemo
, and React.memo
is different so please take note of it.
No one can explain you more than docs, please refer new doc: https://beta.reactjs.org/reference/react/memo
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论