问

Reactjs基于JSON配置动态渲染组件

痴情被撕碎的阳光发布于 2023-02-07 20:57

我有一个以下配置作为JSON

var componentConfig = {
content: { type: "ContentContent", data: "content"},
new_content: { type: "ContentFormContent", data: "content"}
}

在react rendercomponent中,是否可以动态传递组件名称以进行反应渲染.

例如,在这个rendercomponent而不是直接放置ContentFormContent是可以从json配置传递数据,我可以循环或东西.

React.renderComponent(, body);

所以我将在json配置中有一个页面列表,并根据特定导航的选择,我将根据json文件中的"类型"渲染组件

1 个回答

JSX

<ContentFormContent data={[componentConfig.new_content.data]} />

简单地编译成

ContentFormContent({data: [componentConfig.new_content.data]})

所以你可以随心所欲地打电话.在这种情况下,最方便的是列出所有可能的组件并执行类似的操作

var allComponents = {
    ContentContent: ContentContent,
    ContentFormContent: ContentFormContent
};

// (later...)
React.renderComponent(allComponents[component.type]({data: component.data}), body);

if component是示例数组中的元素.

2023-02-07 21:05 回答

修月夕杨_433

撰写答案

今天，你开发时遇到什么问题呢？

立即提问

热门标签