ReactJS CSSクラスが動作しない

Question

ReactJSを使用するにはまだ新しいです。ここに私のコードは

import React, { Component, PropTypes } from 'react'; 
import s from './style.scss'; 
import withStyles from 'isomorphic-style-loader/lib/withStyles'; 
import { Grid, Row, Col } from 'react-bem-grid'; 
class OrderDetails extends Component { 
    render() { 
     return (
      <div> 
      <Row> 
       <form class="orderform"> 
       <h3>Product Details: </h3> 
        <Row> 
        <Col xs={5}> 
         Product: <br /> 
         Category: <br /> 
         Sub Category: <br /> 
         Price: <br /> 
         Color: <br /> 
         Breakdown: 
        </Col> 
        <Col xs={4}> 
         test 
        </Col> 
        </Row> 
       <h3>Print Details</h3> 
        <Row> 
        <Col xs={5}> 
         Print Method: <br /> 
         Position: <br /> 
         Length: <br /> 
         Width: <br /> 
         Colors 
        </Col> 
        </Row> 
       </form> 
      </Row> 
      </div> 
    ); 
    } 
} 
export default withStyles(OrderDetails, s); 

あり、ここで私のstyle.cssファイル

.orderform{ 
    color: red; 
} 

のための私のコードをである私は、特定のフォームのクラスを作成したいが、それは

が動作していませんこれの簡単なコード私はなぜそれが動作していないのか分かりません。 JSXは classNameない classを使用しているのでJSXではJavaScriptですので

Answer 1

、DOCS

から、

return (
     <div> 
     <Row> 
      <form className="orderform"> 

でのような識別子を交換してくださいReactJSでクラスCSSを使用する方法で私を導くようにしてくださいclassおよびforは、XML属性名として推奨されない です。代わりに、React DOMコンポーネント は、それぞれclassNameとhtmlForのようなDOMプロパティ名を期待しています。