JS API 4.x ES modules: how to import watchUtils and Button?

Arpa_PiemonteGeoportal_Team — Wed, 10 Feb 2021 09:09:20 GMT

Hi,
when I used esri-loader, to import watchUtils and Button I wrote:

loadModules([ "dijit/form/Button", "esri/core/watchUtils", ], options) .then(([ Button, watchUtils, ]) => {})

How can I do with ES modules?
I tried:

import Button from '@arcgis/dijit/form/Button'; import watchUtils from "@arcgis/core/watchUtils";

But it doesn't work.

Thanks for help.

Re: JS API 4.x ES modules: how to import watchUtils and Button?

Arpa_PiemonteGeoportal_Team — Thu, 11 Feb 2021 09:10:22 GMT

Ok, I think I solved both problems.
For watchUtils:

import * as watchUtils from '@arcgis/core/core/watchUtils.js';

For button the best solution is (this example put as icon the esri-icon-collection):

var element = document.createElement('div'); element.className = "esri-icon-collection esri-widget--button esri-widget esri-interactive"; element.addEventListener('click', function(evt){ console.log("clicked"); }) view.ui.add(element, "top-right");

If you are using ionic, you can put a ionic icon removing 'esri-icon-collection ' and adding a innerHTML, like;

var element = document.createElement('div'); element.className = "esri-widget--button esri-widget esri-interactive"; element.innerHTML = '<ion-icon name="expand"></ion-icon>' element.addEventListener('click', function(evt){ console.log("clicked"); }) view.ui.add(element, "top-right");

topic JS API 4.x ES modules: how to import watchUtils and Button? in ArcGIS JavaScript Maps SDK Questions

JS API 4.x ES modules: how to import watchUtils and Button?

Re: JS API 4.x ES modules: how to import watchUtils and Button?