【问题标题】:React.js include cssReact.js 包含 css
【发布时间】:2017-12-16 10:04:08
【问题描述】:

我正在从事 MERN.io 项目。 我正在使用 React.js 组件下拉菜单。

但它根本不包含它的样式和 css 和 no-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>         
    )

 ...
}

这是当前下拉菜单如何工作的屏幕截图。 我希望你能提供很大的帮助。 谢谢。

【问题讨论】:

    标签: javascript css reactjs webpack mern


    【解决方案1】:
    import 'react-dropdown/style.css';
    

    【讨论】:

    • 它有效。但是当我想用webpack重建时,它会报错。 /Volumes/Data/Projects/Rantic-Tyler/rantic_mern/client/modules/Order/components/OrderCreateWidget/OrderCreateWidget.js:1939 content.locals; ^ ReferenceError: content is not defined at Object. (/Volumes/Data/Projects/Rantic-Tyler/rantic_mern/client/modules/Order/components/OrderCreateWidget/OrderCreateWidget.js:11:1)
    • @KonstantinJ。请提供更多信息
    • 我正在使用 mern.io 作为启动项目,并且在我的组件中包含该 css 文件。但是当我想编译它时,它会报告像上面这样的错误。我认为是因为 webpack。
    • @KonstantinJ。可以分享一下配置吗?
    猜你喜欢
    • 1970-01-01
    • 2017-11-10
    • 1970-01-01
    • 1970-01-01
    • 2017-09-08
    • 2022-11-20
    • 2014-05-16
    • 2019-07-30
    • 1970-01-01
    相关资源
    最近更新 更多