How to get webix-jet ES6 class view resize event?

Webix JS
#1

Hi! I’m trying to rearrange elements in ui.list widget after outer box resized. This widget is laying inside layout(?) made as ES6 class using webix-jet. There is a template with text caption and a button on the same level as list. I include this complex view as a static subview to window view class.

As I undestand, the width of my view is established automatically as maximum accessible width. I use resizer to adjust the width of left and right pane of my window (it splits for two panes).

Can I get resize event from inside of the view, as I do using ‘onViewResize’ for window widget?

#2

this._resize = this.webix.event(window , “resize”, () => {

        const win = <webix.ui.window>this.getRoot();

        win.config.height = document.body.offsetHeight;

        win.resize();

    });
#3

Hi, @iri_tech , thank you for your answer but unfortunately I can’t uderstand your approach. I managed to get desired component (view) behaviour using getNode() method and ResizeObserver interface of JS.

ready() {
    const node = this.#breadcrumbs.getNode();
    const ro = new ResizeObserver((entries) => {
      for (const entry of entries) {
        console.log('Breadcrumbs new size: ', entry.borderBoxSize);
        console.log('Raw crumbs: ', this.#rawCrumbsList);
        if (this.#rawCrumbsList.length) {
          this.loadData(this.#rawCrumbsList);
        }
      }
    });
    ro.observe(node);
  }