I am rendering a react class using node js as so...

var express = require('express');
var router = express.Router();

var React = require('react');
var reactDom = require('react-dom/server');
var App = React.createFactory(require('../ponents/index'));

router.get('/', function(req,res) {
    var reactHtml = reactDom.renderToString(App({}));
    res.render('../../tutorHub/views/index.jade', {reactOutput: reactHtml});
});
module.exports = router;

The page gets rendered fine, but no function that I add gets called. For example, in my App class...

class App extends React.Component {
    constructor(props) {
        super(props);    
    }
    getClass() {
        return "a_class";
    }

    render() {
        return (
            <div className={this.getClass}></div>
        );
    }
}

module.exports = App;

The getClass function is not called. Instead the className bees the code

class = getClass() {
    return "a_class";
}

instead of simply a_class when I check the html. For some reason, rather than the function being called, it is simply saved as a string and placed in to the className.

Why is this happening? I am not able to call any functions I make. Can someone help me out?

I am rendering a react class using node js as so...

var express = require('express');
var router = express.Router();

var React = require('react');
var reactDom = require('react-dom/server');
var App = React.createFactory(require('../ponents/index'));

router.get('/', function(req,res) {
    var reactHtml = reactDom.renderToString(App({}));
    res.render('../../tutorHub/views/index.jade', {reactOutput: reactHtml});
});
module.exports = router;

The page gets rendered fine, but no function that I add gets called. For example, in my App class...

class App extends React.Component {
    constructor(props) {
        super(props);    
    }
    getClass() {
        return "a_class";
    }

    render() {
        return (
            <div className={this.getClass}></div>
        );
    }
}

module.exports = App;

The getClass function is not called. Instead the className bees the code

class = getClass() {
    return "a_class";
}

instead of simply a_class when I check the html. For some reason, rather than the function being called, it is simply saved as a string and placed in to the className.

Why is this happening? I am not able to call any functions I make. Can someone help me out?

• javascript
• node.js
• reactjs

Share Improve this question Follow edited Aug 24, 2016 at 0:38 Tamas Hegedus 30k1212 gold badges6666 silver badges101101 bronze badges asked Aug 24, 2016 at 0:31 buydadipbuydadip 9,4572222 gold badges9393 silver badges160160 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

The function isn't called because you didn't call it. You can see the function's source, because any function that gets coerected to a string will do the same ((""+(foo=>bar)) === "foo=>bar"). All you have to do is:

<div className={this.getClass()}></div>