变量值改变时调用函数

Question

我正在做 React 项目。我使用了 videojs 播放器，我正在获取视频的当前时间并将其存储在变量 "currentTime" 中。现在我有一个 json 的数组，每个数组都有 startTime 和 endTime 字段。随着视频的进行，我想检查我的 currentTime 是否位于数组中任何 json 的 startTime 或 endTime 之间。所以我想为此做一个检查功能。由于currentTime不断变化，我设置了500毫秒的时间间隔来比较currentTime与startTime和endTime。现在，如果说对于某些 "i"（这是数组中的某些 json），位于两者之间的条件得到满足，我想将 "i" 存储在我的 action reducer 中。至于一段时间 (startTime - endTime) "i" 的值将保持不变，我只想调用我的动作创建者来存储 "i" 的这个值，而不是整个时间 (startTime-结束时间）。

我有一个像这样以 500 毫秒的间隔运行的函数

setInterval(function () {
    that.state.tags.map((item, i) => {
        if( item.time <= currentTime && currentTime <= item.stopTime){
            console.log(i);
        }
    }) , 500
})

现在，当特定 currentTime 的条件得到满足时，变量 i 会保持不变一段时间（比如 5 秒）。我有一个 Redux 动作创建器，它应该在每次 i 的值更改时被触发。由于 i 的值每 500 毫秒存储一次，我不能每 500 毫秒调用一次动作创建器，这也是 i 的相同值。我想在变量 i 的值发生变化时通知或调用动作创建者。我该怎么做？我试过这个（下面），但这是我提到的我不想做的。 markerReachedAction是我要调用的action creator

setInterval(function () {
    that.state.tags.map((item, i) => {
        if( item.time <= currentTime && currentTime <= item.stopTime){
            that.props.markerReachedAction(i);
            console.log(i);
        }
    }) , 500
})

Answer 1

我认为你是说你想在每次 that.state.tags 中的条目时调用 that.props.markerReachedAction 其中 item.time <= currentTime && currentTime <= item.stopTime 更改（例如，时间已经过去，现在匹配的不是条目 0，而是条目 1）。

如果是这样，、setInterval 可能不是正确的工具。但如果没有更多上下文，很难为您指明正确的方向。

在使用 setInterval 时，您需要记住匹配索引的最后一个值。此外， map 是用于循环遍历数组（它构建一个新数组）的错误工具。要循环，请使用 forEach;但在您的情况下，您希望在达到条件时停止循环。通常，这将是 some（通常在达到条件时停止）、find（根据回调在数组中查找特定条目）或 findIndex（查找 index 数组中基于回调的特定条目）。在你的情况下，findIndex:

let lastNotifiedIndex = -1; // -1 won't match any array index, so we'll fire the first time
setInterval(function() {
    // Find the index for which our predicate function returns true
    const index = that.state.tags.findIndex(item => item.time <= currentTime && currentTime <= item.stopTime);

    // If we found one, is it different?
    if (index !== -1 && lastNotifiedIndex !== index) {
        // Yes, notify
        lastNotifiedIndex = index;
        that.props.markerReachedAction(lastNotifiedIndex);
    }
}, 500);

我假设某个地方正在更新 currentTime？如果不是，您可能希望在计时器回调开始时更新它。

变量值改变时调用函数

call a function when the value of variable is changed

javascript

reactjs

react-redux