score:19

Accepted answer

you can't define a constant in the middle of a class, that's invalid syntax. class bodies, by definition1, can only contain method definitions, static method definitions, and empty statements (;)2. define the divstyle inside a method:

class holamundo extends react.component {
    render() {
        const divstyle = {
            color: 'blue',
        };

        return (
          <div classname="container" style={divstyle}> 
            <h1>hola {this.props.name}</h1>
          </div>
        );
    }
}

1per the ecmascript 2015 language specification, section 14.5 - class definitions

2babel currently supports class properties (with plugins). you can also assign an instance variable through the constructor, with this.style = { ... } and access it anywhere in the class with this.style.

score:4

at the bottom of the page (below the class declaration) you can define a styles object:

 const styles = {
  examplestyle: {
    backgroundcolor: 'red',
  }
};

then pass it into a components style prop:

style={styles.examplestyle}

i prefer doing it like this as you can then keep all your styles for the component in one object rather than having a styles object for each of your methods in the class.


Related Query

More Query from same tag