use of 'this' in the class component

LefterisKoumis

I am trying to use this script from the ArcGIS JS API to zoom in for a client-side feature layer. However, I get the error on line 7 due to the 'this' keyword. The prop is necessary since I am referring to the view from another module as suggested from another posting. The error is related to the  'this'  in a class component. I tried to bind the goTo   but didn't work. 

@RobertScheitlin__GISP , @Grant-S-Carroll or anyone else? Thank you.

 

 

this.props.mapView.goTo(response.extent).bind(this);

 

 

 

Error:

Script:

 

 

this.props.mapView.whenLayerView(layer).then(function (layerView) {
        layerView.watch("updating", function (val) {
          // wait for the layer view to finish updating
          if (!val) {
            layerView.queryExtent().then(function (response) {
              // go to the extent of all the graphics in the layer view
              this.props.mapView.goTo(response.extent);
            });
          }
        });
      });

 

 

 

 

 

 

 

Grant-S-Carroll

You can use an arrow function in the callback, this will auto bind the outer scope to the inner scope, kind of like what the old lang.hitch used to do in Web AppBuilder development. 

this.props.mapView.whenLayerView(layer).then((layerView) => {
        layerView.watch("updating", (val) => {
          // wait for the layer view to finish updating
          if (!val) {
            layerView.queryExtent().then((response)=> {
              // go to the extent of all the graphics in the layer view
              this.props.mapView.goTo(response.extent);
            });
          }
        });
      });

 

 

 

 

I've not tested the above, but I think it should work, if not ping me back. The other thing to consider is pushing your callbacks out in to seperate functions as it make the code easier to test, if you're running unit tests etc.