使用className設計react-toolbox元素

我似乎在不使用主題的情況下對組件造型有一些問題。我只想改變一些顏色而不需要爲每個元素創建一個新的主題。使用className設計react-toolbox元素

在這種情況下，我只是想在欄的顏色更改爲褐色而現在我有一個輸入類，如下所示：

import style from './style.scss' 
const TextInput = (props) => { 
    <Input className={style.textInput} {...props} /> 
}

在我style.scss文件：

.textInput { 
    .bar { 
    background-color: #663300; 
    } 
}

任何幫助，將不勝感激。

來源

2016-07-22 JLegendre

-2

ClassName不能像那樣工作。您無法將Css樣式傳遞給className，這是錯誤的。

要麼通過你想申請作爲一個字符串類名（在你的情況，我想它會是className =「textInput欄」），或者你可以創建一個className classNames library（在任何情況下，最終結果將是一個串）。

只要確保您的樣式包含在組件將要呈現的頁面中，並且的反應將足夠聰明以爲每個組件呈現正確的CSS類。

正如你可以檢查in here類名是string

來源

2016-07-22 19:24:17

我不知道我的理解。我在這篇文章中模擬了我的：http://stackoverflow.com/questions/35030308/styling-with-react-toolboxs-button-not-working – JLegendre

你可以在源代碼中看到https://github.com/react- toolbox/react-toolbox/blob/dev/lib/button/Button.js＃L95（有點雜亂），className是一個字符串，而不是css風格，在那裏設置一個斷點並查看該行的結果。這個答案對我來說看起來不太好.. –

OP是使用CSS模塊，我認爲這個回答者並沒有意識到 – LukeP

使用className設計react-toolbox元素

回答

相關問題