I am trying my hand on Lightning apps, trying to load jsTree library on a div of component. When i try component.get("tree"), I get undefined. "tree" is id of a div to load lib into it. Any solution?
I suspect you are using
id= instead of
aura:id= In your Aura markup. Aura IDs solve some problems that have existing in the DOM ID world (flat big ball of mud space) by being local to the scope (app or component). This means there is no dom ID collision issue which is critical for any component based architecture layered on top of HTML, 99% of the time you'll want to use
The correct API to access a component (not the DOM element directly - we'll get to that in a second) is
component.find(auraId) which returns a reference to the component with that aura:id. Everything in Aura is a component - even
<div aura:id="myDiv"/> is actually something closer to
After you get your hands on the component you can simply call
.getElement() on it to finally retrieve the associated DOM subtree, like this:
var myDiv = component.find("myDiv").getElement();
With all of that I think we need to discuss the challenges often encountered with integrating at the DOM level - works fine and is totally supported but the lifecycle of Aura components/apps can make bootstrapping the external library more involved than you might be used to when you own the entire page.