Search code examples
reactjsmartyjs

onClick event doesn't fire in any of my components


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


Solution

  • 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 .