Currently, I am engaged in a project where a form builder (Symfony) is utilized to create forms. At times, an internal Vue component takes the place of standard TextArea inputs with more versatile HTML-based text editors depending on the input id provided as a prop.
An issue arises when there is no element with the id image_id
present on the page, leading to a cascade of JavaScript errors due to the page being rendered using a template.
I am wondering if it is feasible to only mount the image-uploader
component if an element with the id #image_id
exists on the page and prevent its mounting altogether if the element is absent?
Snippet from Component
mounted() {
let DOMInput = document.getElementById(this.inputId);
//component does stuff if not null
//need to prevent the mounting of this component altogether if it is null
Template
<image-uploader input-id="image_id"></image-uploader>