遵循https://nextjs.org/docs/basic-features/layouts#with-typescript指南,修改了我想要使用布局的Home页和_app.tsx页.

指南没有显示Layout.tsx应该是什么样子,而且它目前的错误是:

键入"{children:ReactElement<any,string"|

error screenshot

我是TS新手,不知道如何将页面传递到布局.

推荐答案

错误消息可能会让人非常困惑.

首先,要将组件page传递到布局组件中,需要在<Layout>标记中添加一个属性,该属性的名称为prop,在本例中为"children",如下所示:<Layout children={page}><Layout/>.有关更多信息,请查看此来源:https://reactjs.org/docs/components-and-props.html

此外,功能组件只接受一个"prop"对象作为函数的参数,它是一个包含其他属性的对象.更多信息,请查看第https://fettblog.eu/typescript-react/components/页.

export default function Layout (props : { children : string }) { ...

Typescript相关问答推荐

脉轮ui打字脚本强制执行图标按钮的咏叹调标签-如何关闭

Angular 过滤器形式基于某些条件的数组控制

了解TS类型参数列表中的分配

对于使用另一个对象键和值类型的对象使用TS Generics

我应该使用什么类型的React表单onsubmit事件?

泛型和数组:为什么我最终使用了`泛型T []`而不是`泛型T []`?<><>

类型脚本泛型最初推断然后设置

如何根据模板类型实现不同的模板函数行为?

对扩展某种类型的属性子集进行操作的函数

TypeScrip表示该类型不可赋值

带switch 的函数的返回类型的类型缩小

如何在TypeScrip中正确键入元素和事件目标?

是否可以基于对象的S属性值[]约束对象的其他属性值用于类型化的对象数组?

在对象中将缺省值设置为空值

如果数组使用Reaction-Hook-Form更改,则重新呈现表单

在列表的指令中使用intersectionObservable隐藏按钮

17个Angular 的延迟观察.如何在模板中转义@符号?

类型实例化过深,可能是无限的&TypeScrip中的TupleUnion错误

是否使用类型将方法动态添加到类?

两个子组件共享控制权