Include HTMLElement in conditionally rendered template.

This issue has been tracked since 2023-02-07.

I am using a library that produces an HTMLElement that is typically attached to the DOM with appendChild, or similar. How can I include this element in a conditionally rendered template, similar to the tabs example?

I tried the following code, but the element appears to be missing when the watcher is called:

const element = thirdPartyLibrary.getElement();


function injectElement() {
  if (state.selectedPage === 2) {
    document.getElementById("my-element-div")!.appendChild(element as Node);
  }
}

watch(injectElement);

When I change to tab 2, I get:
Uncaught TypeError: Cannot read properties of null (reading 'appendChild')

justin-schroeder wrote this answer on 2023-02-18

Hmm, not sure I fully understand the use case. Perhaps you can whip up a quick codepen of it?

More Details About Repo
Owner Name justin-schroeder
Repo Name arrow-js
Full Name justin-schroeder/arrow-js
Language TypeScript
Created Date 2022-11-08
Updated Date 2023-03-28
Star Count 1240
Watcher Count 21
Fork Count 22
Issue Count 7

YOU MAY BE INTERESTED

Issue Title Created Date Updated Date