onClick event doesn't fire in any of my components

Question

Im playing with MartyJS, marty-express and react. and the following code:

import React from "react"; 
import _ from "lodash";    


 export default class InputComponent extends React.Component {
   constructor(props, context) {
     super(props, context); 
     this.handleClick = _.bind(this.handleClick,this);
     this.state = {count: props.initialCount};
  } 
  handleClick() {        
      this.setState({count: this.state.count + 1});
  }
  render() {
      return (
        <div>      
          <div className="btn btn-primary"  onClick={this.handleClick}>
                              Clicks: {this.state.count}      
                      </div>
              </div>
      );
} 
  }   

 InputComponent.propTypes = { initialCount: React.PropTypes.number };
 InputComponent.defaultProps = { initialCount: 0 };

And is simply rendered inside of another component like this:

   import InputComponent from "./InputComponent";
   ...
   <InputComponent />

The component is rendered just fine. I have tried most of the examples i could find, following guides to refactor React.createClass to es6, and i did exactly as in the tutorial and it just doesn't work ...

My Hunch is starting to point towards MartyJS, MartyJS and Marty-express should do the initial page load server side rendered, my components constructor if i put in a console.log, is being printed on the server, and never on the client. I am allmost on the verge of just completely dropping server side rendered react because there seems to be so many specifics related and no documentation on it.
Can someone talk about their experiences with this? and maybe point to some code that uses MartyJS w/o SSR ?

Thanks

I am not familiar with Marty.js but if you are doing server sided rendering you must also call render on the component on the client side instead of just dumping HTML into the dom. Otherwise your event handler will not be bound to the elements. You still get the benefits of server-side rendering when you do this. — noveyak, Aug 01 '15 at 21:00

score 0 · Accepted Answer · answered Aug 02 '15 at 15:03

0

Thanks for anyone who took time to look it over.

Maybe it had something to do with martyJs and maybe it didn't, The creator of MartyJS announced that 1.0 will be his last release of it, so im moving over to redux as flux, i hope to find working examples in that framework .

answered Aug 02 '15 at 15:03

DenLilleMand

3,732
5
25
34

My example works perfect, with redux, because redux is 100% client side rendered... So lesson learned, when noob to a framework, stay away from SSR. – DenLilleMand Aug 06 '15 at 19:13

onClick event doesn't fire in any of my components

1 Answers1