Javascript 如何列出特定类的实例？

我目前有一个“datetime”组件，显示时间表示，并希望更改其相对于当前时间的显示

var MDate = React.createClass({
    render: function() {
        // this.props.date is an integer
        var d = new Date(this.props.date);
        var diff = ((new Date() - d) / 1000) | 0;

        return <time>{diff} seconds ago</time>;
    }
});

然后迭代

MDate.items

并为每个项调用forceUpdate（）

---

有没有一种方法可以在不依赖此技巧的情况下列出每个装载的MDate实例？

您不应该真正从组件外部调用

forceUpdate

或

setState

。这是一种方法：

var MDate = React.createClass({
    componentWillMount: function() {
        this._timer = setInterval(this.update, 1000);
    },
    componentWillUnmount: function() {
        clearInterval(this._timer);
    },
    getInitialState() {
        return {
            currentDate: new Date()
        };
    },
    render: function() {
        // this.props.date is an integer
        var d = new Date(this.props.date);
        var diff = ((this.state.currentDate - d) / 1000) | 0;

        return <time>{diff} seconds ago</time>;
    },
    update() {
        this.setState({ currentDate: new Date() });
    }
}

var MDate=React.createClass({
componentWillMount:function（）{
this._timer=setInterval（this.update，1000）；
},
componentWillUnmount:function（）{
clearInterval（此计时器）；
},
getInitialState（）{
返回{
当前日期：新日期（）
};
},
render:function（）{
//this.props.date是一个整数
var d=新日期（此.props.Date）；
var diff=（（this.state.currentDate-d）/1000）0；
返回{diff}秒前；
},
更新（）{
this.setState（{currentDate:new Date（）}）；
}
}

让知道组件何时应该更新的服务发布所有组件实例在

componentDidMount

中侦听的事件。在该事件侦听器中，您调用

setState

以触发组件重新渲染

大概是这样的：

let MDate = React.createClass({
  getInitialState() {
    return this.getState();
  },
  getState() {
    return {
      date: DateStore.get()
    };
  },
  componentDidMount() {
    DateStore.on('change', () => this.setState(this.getState()));
  },
  render() {
    let d = new Date(this.state.date);
    let diff = ((new Date() - d) / 1000) | 0;

    return <time>{diff} seconds ago</time>;
  }
});

让MDate=React.createClass({
getInitialState（）{
返回这个.getState（）；
},
getState（）{
返回{
日期：DateStore.get（）
};
},
componentDidMount（）{
DateStore.on（'change'，（）=>this.setState（this.getState（））；
},
render（）{
设d=新日期（this.state.Date）；
设diff=（（新日期（）-d）/1000）0；
返回{diff}秒前；
}
});

谢谢，我想出了这个解决方案（使用jQuery作弊）

let MDate = React.createClass({
  getInitialState() {
    return this.getState();
  },
  getState() {
    return {
      date: DateStore.get()
    };
  },
  componentDidMount() {
    DateStore.on('change', () => this.setState(this.getState()));
  },
  render() {
    let d = new Date(this.state.date);
    let diff = ((new Date() - d) / 1000) | 0;

    return <time>{diff} seconds ago</time>;
  }
});

var MDate = React.createClass({
    getInitialState: function() {
        return {tick: new Date().getTime()};
    },
    tick: function(ev) {
        this.setState({tick: ev.timeStamp})
    },
    componentWillMount: function() {
        $(document).on('date-tick', this.tick);
    },
    componentWillUnmount: function() {
        $(document).off('date-tick', this.tick);
    },
    render: function() {…}
}

window.setInterval(function() {
    $(document).trigger('date-tick')
}, 20 * 1000);