如何將樣式應用於Bootstrap React元素？

以下是我的應用程序在ReactJS組件內呈現的一行，並保存爲nav.jsx。如何將樣式應用於Bootstrap React元素？

<span style="font-family: 'Open Sans', sans-serif;">&nbsp;Home</span>

例外：

Uncaught Error: The `style` prop expects a mapping from style properties to values, not a string. For example, style={{marginRight: spacing + 'em'}} when using JSX. This DOM node was rendered by `Nav`. 
    at invariant (react.js:18354) 
    at assertValidProps (react.js:6435) 
    at ReactDOMComponent.mountComponent (react.js:6678) 
    at Object.mountComponent (react.js:12978) 
    at ReactDOMComponent.mountChildren (react.js:11692) 
    at ReactDOMComponent._createContentMarkup (react.js:6815) 
    at ReactDOMComponent.mountComponent (react.js:6703) 
    at Object.mountComponent (react.js:12978) 
    at ReactDOMComponent.mountChildren (react.js:11692) 
    at ReactDOMComponent._createContentMarkup (react.js:6815)

這究竟是爲什麼以及如何我申請的字體？

來源

2017-03-17 santafebound

的錯誤狀態如何解決這一問題：

Uncaught Error: The style prop expects a mapping from style properties to values, not a string. For example, style={{marginRight: spacing + 'em'}} when using JSX. This DOM node was rendered by Nav .

的style道具的元素期望有按鍵和對應的CSS屬性值和它們的值的對象：

<span style={{fontFamily: "'Open Sans', 'sans-serif'"}}>&nbsp;Home</span>

記住財產鍵不能包含-和React camelCases CSS屬性名稱，所以font-family變成fontFamily。作爲一個方面說明：我希望在JSX之外聲明一個對象，這樣它就不是內聯的，而是更有組織的（在我看來）。另一種方法是在JavaScript中使用CSS樣式表而不是樣式。

來源

2017-03-17 16:32:58 Li357

如何將樣式應用於Bootstrap React元素？

回答

相關問題