Javascript 如何处理道具和状态以避免无限循环？

我有一个组件从它的父母那里获取道具，我正在检查componentDidUpdate（）中的this.props.addMarker是否为true，如果为true，它将触发一个有setState的函数

您可以想象接下来会发生什么：setState触发componentDidUpdate（）函数，该函数检查this.props.addMarker是否为true……等等

我应该如何避免此类问题

这是我的密码：

componentDidUpdate() {  
    if(this.props.addMarker) {
      const place = this.props.coordinatesToCenter;
      const coord = place.coordinates;

      this.addMarkerProcess(place.place_name, place.place_type, coord.lon, coord.lat);
    }
}

addMarkerProcess(name, maki, xCoordinate, yCoordinate) {
    const data = {
      type: 'Feature',
      geometry: {
        type: 'Point',
        coordinates: [xCoordinate, yCoordinate]
      },
      properties: {
        // place:
        // login:
        lat: yCoordinate,
        lon: xCoordinate,
        color: "#00FFFF"
      }
    };

    if(this.state.clickIsEmpty) {
      data.properties.place = this.state.userNewPlaceInput;
      data.properties.login = this.state.userNewTypeInput;
    } else {
      data.properties.place = name;
      data.properties.login = maki;
    }

    const prevGeoJson = _.cloneDeep(this.state.geoJson);
    console.log("prevGeojson1", prevGeoJson)
    // map only rerenders geoJSONLayer if geoJSONLayer.data is a new instance:
    const geoJson = Object.assign({}, this.state.geoJson);
    geoJson.features.push(data);

    this.setState(prevState => ({
      prevGeoJson: prevGeoJson,
      geoJson: geoJson,
      currentMarker: data
    }));

    let canvas = document.querySelector('.mapboxgl-canvas');
    if(canvas.classList.contains("cursor-pointer")) {
      canvas.classList.remove("cursor-pointer");
    }
  }

componentdiddupdate（）

在更新后立即被调用，因此如果调用

setState（）

而不在条件中包装，将不可避免地导致无限循环发生。 您可以根据新的

道具和以前的
道具之间的比较来调用
setState（）

componentDidUpdate(prevProps) {
    if(this.props.data !== prevProps.data) 
        this.fetchNewData(this.props.data);
}

componentdiddupdate（）
在更新后立即被调用，因此如果调用
setState（）
而不在条件中包装，将不可避免地导致无限循环发生。
您可以根据新的
道具和以前的
道具之间的比较来调用
setState（）

componentDidUpdate(prevProps) {
    if(this.props.data !== prevProps.data) 
        this.fetchNewData(this.props.data);
}

在您当前的设置中，它实际上是不可控的。如果你是否应该添加一个标记是由外部机械师决定的，在设置新状态之前，通过道具发送一个处理函数将其设置为false，不要使用
setState
，或者提出另一个条件来阻止它循环。@zfrisch-hmm，好的，我明白了，谢谢你的明确回答。使用mobX或Redux这样的库是否有助于解决此类问题？在当前的设置中，它实际上是不可控的。如果你是否应该添加一个标记是由外部机械师决定的，在设置新状态之前，通过道具发送一个处理函数将其设置为false，不要使用
setState
，或者提出另一个条件来阻止它循环。@zfrisch-hmm，好的，我明白了，谢谢你的明确回答。使用mobX或Redux这样的库是否有助于解决此类问题？