Semantic-UI-React Footer

Question

过去几天我一直在学习ReactJS，并一直试图在ReactJS中使用semantic-ui-react构建网站。我知道现在可以使用的组件，但我坚持在创建页脚等场景中做什么......通常，在我的原始HTML中，我将包含semantic.min.css文件并位于底部：

<div class="ui inverted pink vertical footer segment"> 
     <div class="ui center aligned container"> 
      <h4 class="ui inverted header">&copy; Copyright 2017 | All rights reserved | Blahhh</h4> 
      <a href="https://www.facebook.com/"><i class="facebook square icon big"></i></a> 
      <a href="https://twitter.com/"><i class="twitter square icon big"></i></a> 
      <a href="https://www.linkedin.com/company/c"><i class="linkedin square icon big"></i></a> 
     </div> 
    </div> 

现在我想把它翻译成semantic-ui-react。页脚是一个类，不是默认情况下的一个组件，所以没有它的组件...我认为这意味着我必须创建自己的组件，并基本编写上面的代码。我现在的问题是，我不知道如何使它呈现，就好像我使用普通的旧的semantic.min.css一样。我读了一个地方下载css文件并包含它，但其中一个，我不知道在哪里（MyCustomFooterComponent或index.html），这样做，我的网站上的加载时间不会增加。这是否意味着在任何地方都有一个页脚，只是一小段自定义代码，整个CSS文件将被加载？

另外，建立后，我会添加Semantic CSS和semantic-ui-react的CSS，是否会出现双重导入场景？

对不起长期的问题，但我是新来的，我想在发现一个可怕的错误之前找出我能做的。

Answer 1

如果您正在使用react-semantic-ui，那么您已经包含'old semantic-ui.min.css'。见here。

因此，创建一个组件并将这些代码放入render（）中，将'class'更改为'className'，然后使用它。