javascript - own timer component with react, reflux not working -


i try used reflux , forked example repo. full code here [ https://github.com/svenhornberg/react-starterkit ]

i want create timer component gets current time timestore, not working. devtools not show errors. must newbie mistakes, not find them.

edit1: added line in home //edit1

edit2: think mistake may in componentdidmount in home.jsx

fixed need trigger time, see answer.

store

import reflux 'reflux'; import timeactions '../actions/timeactions';  var timestore = reflux.createstore({     listenables: timeactions,      init() {         this.time = '';     },      oncurrenttime() {         this.time = '13:47';     } }); 

export default timestore;

actions

import reflux 'reflux';  var timeactions = reflux.createactions([   'currenttime' ]);  export default timeactions; 

component

import react 'react';  class timer extends react.component {    constructor(){     super();       }    render() {     var time = this.props.time;      return (       <div>         { time }       </div>     );   }  }  timer.proptypes = {   time : react.proptypes.string }  export default timer; 

i wanted use timer component in home.jsx

import react 'react'; import itemlist '../components/itemlist.jsx'; import itemstore '../stores/itemstore'; import itemactions '../actions/itemactions';  import timer '../components/timer.jsx'; import timestore '../stores/timestore'; import timeactions '../actions/timeactions';  class home extends react.component {    constructor(props){     super(props);     this.state = {       items : [],       loading: false,       time : '' //edit1     };   }    componentdidmount() {     this.unsubscribe = itemstore.listen(this.onstatuschange.bind(this));     this.unsubscribe = timestore.listen(this.onstatuschange.bind(this));      itemactions.loaditems();     timeactions.currenttime();   }    componentwillunmount() {     this.unsubscribe();   }    onstatuschange(state) {     this.setstate(state);   }    render() {      return (       <div>         <h1>home area</h1>         <itemlist { ...this.state } />         <timer { ...this.state } />       </div>     );   } }  export default home; 

i fixed to: how make react.js component listen store in reflux

i have trigger time:

var timestore = reflux.createstore({     listenables: timeactions,      init() {         this.time = '';     },      oncurrenttime() {       this.trigger({         time : '13:47'       });     } }); 

Comments

Popular posts from this blog

angularjs - ADAL JS Angular- WebAPI add a new role claim to the token -

php - CakePHP HttpSockets send array of paramms -

node.js - Using Node without global install -