Reaktionskomponente nicht auf Schienen wirken Sicht

Question

Meine reagierende Komponente wird nicht auf Schienen angezeigt. Ich verstehe nicht, was falsch ist. Es gibt auch keinen Fehler. nur leere Seite.

habe ich bereits installiert reagieren Schienen gem

Hier ist mein restaurant.js.jsx

var Restaurant = React.createClass({ 
    propTypes: { 
     name: React.propTypes.string, 
     address: React.propTypes.string, 
     description: React.propTypes.text 
    }, 

    render: function() { 
     return(
      <div> 
       <div> Name: {this.props.name}</div> 
       <div> Address: {this.props.address}</div> 
       <div> Description: {this.props.description}</div> 
      </div> 
      ); 
    } 
}) 

Hier ist meine index.html.erb

<%= react_component('Restaurant', {name: 'jdjdd', address: 'dnjkdndjlbkdj', description: 'dljbdjl'}) %> 

Answer 1

Nicht sicher, wie genau der Rails-Edelstein funktioniert, aber React.propTypes.text ist kein gültiger propType. Von der ;

React.createClass({ 
    propTypes: { 
    // You can declare that a prop is a specific JS primitive. By default, these 
    // are all optional. 
    optionalArray: React.PropTypes.array, 
    optionalBool: React.PropTypes.bool, 
    optionalFunc: React.PropTypes.func, 
    optionalNumber: React.PropTypes.number, 
    optionalObject: React.PropTypes.object, 
    optionalString: React.PropTypes.string, 

    // Anything that can be rendered: numbers, strings, elements or an array 
    // (or fragment) containing these types. 
    optionalNode: React.PropTypes.node, 

    // A React element. 
    optionalElement: React.PropTypes.element, 

    // You can also declare that a prop is an instance of a class. This uses 
    // JS's instanceof operator. 
    optionalMessage: React.PropTypes.instanceOf(Message), 

    // You can ensure that your prop is limited to specific values by treating 
    // it as an enum. 
    optionalEnum: React.PropTypes.oneOf(['News', 'Photos']), 

    // An object that could be one of many types 
    optionalUnion: React.PropTypes.oneOfType([ 
     React.PropTypes.string, 
     React.PropTypes.number, 
     React.PropTypes.instanceOf(Message) 
    ]), 

    // An array of a certain type 
    optionalArrayOf: React.PropTypes.arrayOf(React.PropTypes.number), 

    // An object with property values of a certain type 
    optionalObjectOf: React.PropTypes.objectOf(React.PropTypes.number), 

    // An object taking on a particular shape 
    optionalObjectWithShape: React.PropTypes.shape({ 
     color: React.PropTypes.string, 
     fontSize: React.PropTypes.number 
    }), 

    // You can also specify a custom validator. It should return an Error 
    // object if the validation fails. Don't `console.warn` or throw, as this 
    // won't work inside `oneOfType`. 
    customProp: function(props, propName, componentName) { 
     if (!/matchme/.test(props[propName])) { 
     return new Error(
      'Invalid prop `' + propName + '` supplied to' + 
      ' `' + componentName + '`. Validation failed.' 
     ); 
     } 
    }, 

    // You can also supply a custom validator to `arrayOf` and `objectOf`. 
    // It should return an Error object if the validation fails. The validator 
    // will be called for each key in the array or object. The first two 
    // arguments of the validator are the array or object itself, and the 
    // current item's key. 
    customArrayProp: React.PropTypes.arrayOf(function(propValue, key, componentName, location, propFullName) { 
     if (!/matchme/.test(propValue[key])) { 
     return new Error(
      'Invalid prop `' + propFullName + '` supplied to' + 
      ' `' + componentName + '`. Validation failed.' 
     ); 
     } 
    }) 
    }, 
    /* ... */ 
}); 

Wie bei vielen Komponentenfehlern werden Sie wahrscheinlich so etwas wie "React is undefined" sehen. in deiner Konsole.