我尝试习惯回流并 fork 了一个示例存储库。我的完整代码在这里[https://github.com/svenhornberg/react-starterkit ]
我想创建一个计时器组件,它从时间存储中获取当前时间,但它不起作用。 DevTools 没有显示任何错误。这肯定是一些新手错误,但我没有发现它们。
Edit1:我在 home//edit1 添加了一行
Edit2:我认为错误可能出在home.jsx中的componentDidMount
已修复我需要触发我的时间,请查看我的答案。
商店
import Reflux from 'reflux';
import TimeActions from '../actions/timeActions';
var TimeStore = Reflux.createStore({
listenables: timeActions,
init() {
this.time = '';
},
onCurrenttime() {
this.time = '13:47';
}
});
导出默认TimeStore;
操作
import Reflux from 'reflux';
var TimeActions = Reflux.createActions([
'currenttime'
]);
export default TimeActions;
组件
import React from '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;
我想在home.jsx中使用计时器组件
import React from 'react';
import ItemList from '../components/itemList.jsx';
import ItemStore from '../stores/itemStore';
import ItemActions from '../actions/itemActions';
import Timer from '../components/timer.jsx';
import TimeStore from '../stores/timeStore';
import TimeActions from '../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;
最佳答案
我修复了它,感谢:How to Make React.js component listen to a store in Reflux
我必须触发我的时间:
var TimeStore = Reflux.createStore({
listenables: TimeActions,
init() {
this.time = '';
},
onCurrenttime() {
this.trigger({
time : '13:47'
});
}
});
关于javascript - 自己的定时器组件与 react ,回流不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30561352/