require(["esri/core/Accessor"], (Accessor) => { /* code goes here */ });
import Accessor from "@arcgis/core/core/Accessor.js";
esri/core/Accessor
Accessor is an abstract class that facilitates the access to instance properties as well as a mechanism to watch for property changes. Every sub-class of Accessor defines properties that are directly accessible or by using the get() and set() methods. It is possible to watch for a property changes by using the watch() method.
Property Overview
Name | Type | Summary | Class |
---|---|---|---|
The name of the class. | Accessor |
Property Details
-
declaredClass
declaredClass Stringreadonly
Since: ArcGIS Maps SDK for JavaScript 4.7Accessor since 4.0, declaredClass added at 4.7. -
The name of the class. The declared class name is formatted as
esri.folder.className
.
Method Overview
Name | Return Type | Summary | Class |
---|---|---|---|
Adds one or more handles which are to be tied to the lifecycle of the object. | Accessor | ||
Creates a subclass of the class calling this method. | Accessor | ||
* | Gets the value of a property. | Accessor | |
Returns true if a named group of handles exist. | Accessor | ||
Removes a group of handles owned by the object. | Accessor | ||
* | Sets the value of a property. | Accessor | |
Watches for property changes on the instance. | Accessor |
Method Details
-
Since: ArcGIS Maps SDK for JavaScript 4.25Accessor since 4.0, addHandles added at 4.25. -
Adds one or more handles which are to be tied to the lifecycle of the object. The handles will be removed when the object is destroyed.
// Manually manage handles const handle = reactiveUtils.when( () => !view.updating, () => { wkidSelect.disabled = false; }, { once: true } ); this.addHandles(handle); // Destroy the object this.destroy();
ParametershandleOrHandles WatchHandle|WatchHandle[]Handles marked for removal once the object is destroyed.
groupKey *optionalKey identifying the group to which the handles should be added. All the handles in the group can later be removed with Accessor.removeHandles(). If no key is provided the handles are added to a default group.
-
createSubclass
createSubclass(classDefinition){Accessor}static
Since: ArcGIS Maps SDK for JavaScript 4.21Accessor since 4.0, createSubclass added at 4.21. -
Creates a subclass of the class calling this method.
ParameterclassDefinition ObjectAn object with properties and methods to mix in to the newly created class.
ReturnsType Description Accessor Returns a constructor of the newly created class.
-
Deprecated since version 4.28. Use optional chaining
-
Gets the value of a property.
The name of the property can refer to a property in the instance.
view.get("scale");
It can also be a path to a property deeper in the instance.
get()
returnsundefined
if a property in the path doesn't exist.let title = map.get("basemap.title"); // equivalent of let title = map.basemap && map.basemap.title || undefined;
Parameterpath StringThe path of the property to get.
ReturnsType Description * The property's value.
-
hasHandles
hasHandles(groupKey){Boolean}
Since: ArcGIS Maps SDK for JavaScript 4.25Accessor since 4.0, hasHandles added at 4.25. -
Returns true if a named group of handles exist.
ParametergroupKey *optionalA group key.
ReturnsType Description Boolean Returns true
if a named group of handles exist.Example// Remove a named group of handles if they exist. if (obj.hasHandles("watch-view-updates")) { obj.removeHandles("watch-view-updates"); }
-
Since: ArcGIS Maps SDK for JavaScript 4.25Accessor since 4.0, removeHandles added at 4.25. -
Removes a group of handles owned by the object.
ParametergroupKey *optionalA group key or an array or collection of group keys to remove.
Exampleobj.removeHandles(); // removes handles from default group obj.removeHandles("handle-group"); obj.removeHandles("other-handle-group");
-
Sets the value of a property.
Call
set()
with a property name and a value to change the value of the property.// setting the basemap of the map map.set("basemap", "topo-vector"); // is equivalent to map.basemap = "topo-vector"; // currying set let updateViewScale = view.set.bind(view, "scale"); updateViewScale(5000);
set()
can be called with the path to a property and a value. The property is not set if a property in the path doesn't exist.// updating the title of the basemap map.set("basemap.title", "World Topographic Map"); // is equivalent to if (map.basemap != null) { map.basemap.title = "World Topographic Map"; }
An object with key-value pairs may be passed into
set()
to update multiple properties at once.// setting a viewpoint on the view view.set({ center: [-4.4861, 48.3904], scale: 5000 }); // currying set let updateView = view.set.bind(view); updateView({ center: [-4.4861, 48.3904], scale: 5000 });
ParametersReturnsType Description * The instance.
-
watch
watch(path, callback){WatchHandle}
-
Watches for property changes on the instance. For additional capabilities when observing changes on properties, see reactiveUtils.
Watching for property changes is essential for tracking changes on objects. To start watching for changes on a property, call
watch()
with the property name and a callback function that will execute each time the property changes.let handle = mapview.watch("scale", function(newValue, oldValue, propertyName, target) { console.log(propertyName + " changed from " + oldValue + " to " + newValue); });
To stop watching for changes, call the
remove()
method on the object thatwatch()
returns.handle.remove();
It is important to store the resulting objects from
watch()
to properly clean up the references.let viewHandles = []; function setView(view) { // remove the handles for the current view. viewHandles.forEach(function(handle) { handle.remove(); }); viewHandles.length = 0; this.view = view; // watch for properties on the newly set view. if (view) { viewHandles.push( view.watch("scale", scaleWatcher); ); } } setView(mapView); setView(null);
Like
get()
andset()
, it is possible to watch for a property deep in the object hierarchy by passing a path. If a property in the path doesn't exist the watch callback is called withundefined
.let view = new SceneView({ map: new Map({ basemap: "streets-vector" }) }); view.watch("map.basemap.title", (newValue, oldValue) => { console.log("basemap's title changed from " + oldValue + " to " + newValue); }); view.map.basemap = "topo-vector"; // output: "basemap's title changed from Streets to Topographic" view.map = null; // output: "basemap's title changed from Topographic to undefined"
Pass a comma delimited list of property paths, or an array of property paths, to watch multiple properties with the same callback. Use the third parameter of the callback call to determine what property changed.
view.watch("center, scale, rotation", (newValue, oldValue, propertyName) => { console.log(propertyName + " changed"); }); // equivalent of view.watch(["center", "scale", "rotation"], (newValue, oldValue, propertyName) => { console.log(propertyName + " changed"); }); // equivalent of let callback = (newValue, oldValue, propertyName) => { console.log(propertyName + " changed"); } view.watch("center", callback); view.watch("scale", callback); view.watch("rotation", callback);
Accessor
doesn't call the watch callbacks for a property immediately after its value changes. Instead, when a property's value changes and if that property is watched,Accessor
schedules a notification which is then processed at a later time. Properties that change frequently likeview.scale
can be watched without having to throttle the callback.// Divides the view.scale three times view.watch("scale", (newValue, oldValue) => { console.log("view's scale changed from " + oldValue + " to " + newValue); }); console.log("current view scale: " + view.scale); view.scale = view.scale / 2; view.scale = view.scale / 2; view.scale = view.scale / 2; console.log("current view scale: " + view.scale); // output the following: // current view scale: 36978595.474472 // current view scale: 4622324.434309 // view's scale changed from 36978595.474472 to 4622324.434309
ParametersThe property or properties to watch. Multiple properties can be specified as a comma-separated list.
callback watchCallbackThe callback to execute when the property value has changed.
ReturnsType Description WatchHandle A watch handle
Type Definitions
-
Callback to be called when a watched property changes.
Parameters
-
WatchHandle
WatchHandle Object
-
Represents a watch or event handler which can be removed.
- Property
-
remove Function
Removes the watch handle.
Examplelet handle = reactiveUtils.watch(() => map.basemap, (newVal) => { // Each time the value of map.basemap changes, it is logged in the console console.log("new basemap: ", newVal); }); // When remove() is called on the watch handle, the map no longer watches for changes to basemap handle.remove();