如何删除额外的 div 包装器

Posted 2023-02-22

【中文标题】如何删除额外的 div 包装器

【英文标题】：How do remove the extra div wrapper

【发布时间】：2019-02-11 09:17:10

【问题描述】：

是否可以禁用 react disable react extra div 包装器？ 我正在使用 ES2015。

包装器使我的两种风格不在 C# 中以我的组件为中心。

#First div
.default-content 
    margin-right: auto;
    margin-left: auto;
    padding: 16px 16px 16px 16px;


#second div
.full-width 
    width:100%;

渲染后的代码如下所示：

    <react-container params="component: MontelUI.React.CompactStory, args:  
     newsId: 955888, userId: 1003465, bookmarkMainProp: false  ">
       <div>
           <div>hei</div>
       </div>
    </react-container>

我的渲染函数如下所示：

render() 

    return (
        <div>hei</div>
    )

组件是通过自定义标签调用的。

【参考方案1】：

使用React.Fragment 将内容括起来。

render() 
    return (
        <React.Fragment>hei</React.Fragment>
    )

【讨论】：

@KhoaLe 你需要 React 16 才能使用 Fragment

@LucaFabbri moment": "^2.22.2", "react": "^16.4.2", "react-animate-on-change": "1.0.1", "react-dom": "^16.4.2", "react-html-parser": "^2.0.2", "react-modal": "3.1.2 好像我明白了，有什么意见吗？

是的，你应该有Fragment。你是如何导入它的，你得到了什么错误？

@LucaFabbri 我得到的错误是 Fragment 不是一种反应。你知道什么？

import Fragment from 'react' 它说 types/react/index 没有导出成员'Fragment'