Reply To: smart-editor onToobarItemClick event

[jqwidgetsdev]

Hi,

Yes I have seen the documentation. However, when I try this myself, console.log(editorItems); // returns []

Any pointers as to what I am doing wrong?

<template>
  <div class="vue-root">
      <smart-editor id="editor"></smart-editor>

  </div>
</template>

<script setup>
import { onMounted } from "vue";
import "smart-webcomponents/source/styles/smart.default.css";
import "smart-webcomponents/source/modules/smart.editor.js";

window.Smart(
  "#editor",
  class {
    get properties() {
      return {
        //Properties
        toolbarItems: [
          {
            name: "settings",
            width: "auto",
            template: "settings"
          }
        ]
      };
    }
  }
);

onMounted(() => {
  const editorItems = Array.from(document.querySelectorAll('smart-editor-toolbar-item'));
  console.log(editorItems); // returns []
  
  editorItems.forEach(item => {
      console.log(item);
  
      item.addEventListener('toolbarItemClick', (event) => {
         const detail = event.detail,
        //      originalEvent = detail.originalEvent,
        value = detail.value;

      console.log(value);
    })
  })
});
</script>