覆蓋反應中的css類

Question

我的目標是在反應中覆蓋css類。已經定義的類具有來自css框架的屬性。我想保存這些屬性並添加一些新的屬性。

HTML：

import styles from '../../css/style.scss'; 

export default class Class extends React.Component { 

    constructor() { 
    super(); 
    } 

    render() { 
    return (
     <div className="item"> 
     <div className="image"> 
      <img src="" /> 
     </div> 
     <div className="content"> 
      <span className="header"><span> 
     </div> 
     </div> 
    ); 
    } 
}; 

薩斯：

.item { 
    .content { 
     .header { 
      text-transform: capitalize; 
     } 
    } 
} 

Answer 1

用途：

require("!style!css!sass!../../css/style.scss"); 

代替：

import styles from '../../css/style.scss'; 

Answer 2

您可以使用內嵌樣式reactjs做到這一點： -

import styles from '../../css/style.scss'; 

export default class Class extends React.Component { 

    constructor() { 
    super(); 
    } 

    render() { 

    const styles={ 
     'textTransform': 'capitalize'; 
     //define other properties here, use camel case(remember we are using Javascript) 
    } 

    return (
     <div className="item"> 
     <div className="image"> 
      <img src="" /> 
     </div> 
     <div className="content"> 
      <span className="header" style={style}><span> 
     </div> 
     </div> 
    ); 
    } 
};