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'，然後使用它。