报错信息:
The tag <Pane> is unrecognized in this browser. If you meant to render a React component, start its name with an uppercase letter.
背景:用react-split-pane插件2.0.3版本时,只能导出SplitPane,使用下面范例会报告警
<SplitPane split="vertical"> <Pane/> <Pane/> <SplitPane split="horizontal"> <Pane/> <Pane/> <Pane/> </SplitPane> <Pane/> </SplitPane> // 数据 { id: '1', props: { split: "horizontal", }, children: [{ type: 'Pane', props: { initialSize: '25%', } }, { type: 'Pane', props: { initialSize: '75%', } }] }, // render item.children.map((Item: any) => { return <Item.type key={item.id} {...Item.props} /> })
原因:Pane不能导出,在React中 <Item.type /> 必须是一个对象 不能是字符串,因此需要做下转换
解决方案:
const Pane = function () { return '' }; { id: '1', props: { split: "horizontal", }, children: [{ type: Pane, props: { initialSize: '25%', } }, { type: Pane, props: { initialSize: '75%', } }] }
The tag 「Pane」 is unrecognized in this browser. If you meant to render a React component, start its
最新推荐文章于 2022-02-18 08:16:31 发布