2017-07-12 13 views
0

私はMERN.ioプロジェクトに取り組んでいます。 React.jsコンポーネントDropdownを使用しています。React.jsにはcssが含まれています

しかし、それはそのスタイルとCSSとまったく-styingが含まれていません。

... 
import Dropdown from 'react-dropdown'; 
import styles from './../../../../assets/css/style.css'; 

class OrderCreateWidget extends Component { 
... 
    render() { 
... 
    return(
     <div> 
     <div className={styles["row"]}> 
      <div className={styles["col-lg-12"]}> 
      <div className={styles["card"]}> 
       <div className={styles["card-header"]}> 
       Place Order 
       </div> 
       <div className={styles["card-block"]}> 
       <h5>*NOTICE* Please make sure that you have "Followers" enabled on your profile so that the share button appears for non-friends too, that will enable us to promote your post.</h5> 
       <br/> 
       <div className={styles["row"]}> 
        <div className={styles["col-lg-7"]}> 
        <div className={`${styles["row"]} ${styles["form-group"]}`}> 
         <label className={styles["col-md-3"]}>Service</label> 
         <Dropdown options={options} onChange={this._onSericeSelect} value='fb_likes1' placeholder="Select an option" /> 
        </div> 
        </div> 
       </div> 
       </div> 
      </div> 
      </div> 
     </div> 
     </div> 
    </div>   
    ) 

... 
} 

enter image description here

これは、現在、どのようにドロップダウン作品のスクリーンショットです。 私はあなたから大きな助けを願います。 ありがとうございます。

答えて

0
import 'react-dropdown/style.css'; 
+0

それは動作します。しかし、webpackで再構築したいときは、エラーを報告します。 /Volumes/Data/Projects/Rantic-Tyler/rantic_mern/client/modules/Order/components/OrderCreateWidget/OrderCreateWidget.js:1939 content.locals。 ^ にReferenceError:コンテンツはオブジェクトで が定義されていません。 (/Volumes/Data/Projects/Rantic-Tyler/rantic_mern/client/modules/Order/components/OrderCreateWidget/OrderCreateWidget.js:11:1) –

+0

@KonstantinJ。 more info please – Skribja

+0

私はmern.ioを開始プロジェクトとして使用しています。私はそのコンポーネントにそのcssファイルを含めています。 しかし、私はそれをコンパイルしたいとき、上記のようなエラーを報告します。 ウェブパックのためだと思います。 –

関連する問題