How to use resize-observer - 4 common examples

async mounted() {
		// Observe the change to the width property, the be able to instantly recompute the height.
		// We compute the height property of the element based on the computed width to be able to set a proper placeholder.
		this.resizeObserver = new ResizeObserver(() => {
			this.setHeight();
		});
		this.resizeObserver.observe(this.$refs.container);
	}

async mounted() {
		// Observe the change to the width property, the be able to instantly recompute the height.
		// We compute the height property of the element based on the computed width to be able to set a proper placeholder.
		this.resizeObserver = new ResizeObserver(() => {
			this.setHeight();
		});
		this.resizeObserver.observe(this.$refs.container);
	}

this.plugins = createPlugins(this, this.schema);

		if (this.value) {
			const doc = ContentDocument.fromJson(this.value);
			this.setContent(doc);
		} else {
			const state = EditorState.create({
				doc: DOMParser.fromSchema(this.schema).parse(this.$refs.doc),
				plugins: this.plugins,
			});

			this.createView(state);
		}

		// Observe any resize events so the editor controls can be repositioned correctly
		this.resizeObserver = new ResizeObserver(() => {
			this.stateCounter++;
		});
		this.resizeObserver.observe(this.$refs.doc);

		this.stateCounter++;

		this.focusWatcher = new FocusWatcher(this.$refs.editor, this.onFocusIn, this.onFocusOut);
		this.focusWatcher.start();

		if (this.view instanceof EditorView && this.autofocus) {
			this.$refs.editor.focus();
			this.view.focus();
		}
	}

componentDidMount() {
    this.element = ReactDOM.findDOMNode(this)
    this.observer = new ResizeObserver(this.handleResize)
    this.observer.observe(this.element)
  }