Skip to content

Instantly share code, notes, and snippets.

@danic85
Created November 23, 2016 10:16
Show Gist options
  • Save danic85/d56e11650783e7fd6f635e962da3d79b to your computer and use it in GitHub Desktop.
Save danic85/d56e11650783e7fd6f635e962da3d79b to your computer and use it in GitHub Desktop.
Control visibility of lightning component using slds-hide
<!-- Component Markup -->
<div aura:id="yourIdentifier">
<c:Your_Component />
</div>
/**
* Controller Method
*/
showComponent : function (component, event, helper) {
$A.util.removeClass(component.find("yourIdentifier"), "slds-hide");
},
hideComponent : function (component, event, helper) {
$A.util.addClass(component.find("yourIdentifier"), "slds-hide");
}
@Maxscores
Copy link

This is great, didn't know about 'slds-hide'. I'd provide an improvement by using $A.util.toggleClass. Can simplify this to a single method like so:

toggleComponent : function (component, event, helper) {
	$A.util.toggleClass(component.find("yourIdentifier"), "slds-hide");
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment