Reactjs React redux阻止从旧状态更新组件

Reactjs React redux阻止从旧状态更新组件,reactjs,redux,state,redux-saga,Reactjs,Redux,State,Redux Saga,我有地图组件,地图中心位置连接到redux州 <YandexMapView ref={this._mapRef} location={this.props.location} onInteraction={(event) => this.onMapPositionChanged(event)} geocodingEnabled={true}

我有地图组件,地图中心位置连接到redux州

<YandexMapView
                ref={this._mapRef}
                location={this.props.location}
                onInteraction={(event) => this.onMapPositionChanged(event)}
                geocodingEnabled={true}
                onGeocoding={(event) => this.onGeocoding(event)}
            />
当我移动地图时,然后在短时间内再次移动它,在我的旧状态将更新为组件之前,我有无限的抖动效应

异常顺序为:

  • 组件发送事件以使用数据{纬度:1,经度:1}更新状态

  • 状态更新为{纬度:1,经度:1}

  • 此时,组件将发送另一个事件以更新状态={latitude: 2,经度:2}因为我移动了地图

  • 组件接收props中的旧状态={纬度:1,经度:1}

  • 组件将其地图位置更新为旧的{纬度:1,经度:1}并再次发送{纬度:1,经度:1}

  • 所有这些行为都变得无限


    我试图在我的redux传奇中添加延迟或限制,但没有任何帮助。

    您需要将用户启动的地图移动事件与通过编程方式移动地图生成的事件分开。您可能只想为移动地图的用户的事件调用
    onMapPositionChanged


    您尚未指定要使用的库,但对于React-Native,例如DoomPower/React-Native yandexmapkit的
    onInteraction
    回调具有可用于此目的的。您使用的任何库都可能支持类似的功能。

    那么您是说您创建了一个无限循环?也许是因为双重事件,你有没有办法限制这些事件只发生一次?
    onMapPositionChanged(event: OnInteractionResult) {
        const {latitude, longitude} = event;
        this.props.dispatch(updateLocation({
            latitude, longitude,
        }));
    }