Question

我正在使用本机反应，我想近实时获取“时间前”消息。（例如：1分钟前，3小时前等）

我的问题是我很难告诉我的应用它必须每X秒刷新一次日期。

  componentDidMount(){

  setInterval(() => {
    this.refresh()
    },30000)


}

refresh = () => {
   content = <Text note>{this.getTimeAgo()}</Text>
    return content
}

getTimeAgo = () => {
  //doing stuff to format then
  return TimeAgo
}

实际上，它只能工作一次（前30秒及其后不再更新（不再调用getTimeAgo（））。

）

所以我不知道为什么它一次调用getTimeAgo（），我至少需要每30秒调用一次。

我错过了什么？

谢谢

Answer 1

它将返回到哪里？设置一个状态值（可能称为timeAgo？），使组件每30秒更新一次该状态值，以便React触发render()，然后在渲染函数中点击该值以将其显示给您的用户：

class TimerThing extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      timeAgo: 0
    };
  }

  componentDidMount() {
    setInterval(() => this.setTimeAgo(),30000)
  }

  render() {
    return <Text note>{this.state.timeAgo}</Text>
  }

  setTimeAgo() {
    var timeAgo;

    // ...do computy things...

    this.setState({ timeAgo });
  }
}

Answer 2

您是否尝试过使用setState，然后使用状态中该项目的值作为组件的内容？

类似这样的东西：

setInterval(() => {
  this.setState({timeAgo: this.getTimeAgo()});
}, 30000);

在return方法的render中，包含

{this.state.timeAgo}

您想要显示时间的地方。

无法实时获取时间

2 个答案: