Checking Component Validity

Inside the Framework Lifecycle

You don’t need a cmp.isValid() check in the callback in a client-side controller when you reference the component associated with the client-side controller. The framework automatically checks that the component is valid. Similarly, you don’t need a cmp.isValid() check during event handling or in a framework lifecycle hook, such as the init event.

Let’s look at a sample client-side controller.

({
    "doSomething" : function(cmp) {
        var action = cmp.get("c.serverEcho");
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                if (cmp.get("v.displayResult)) {
                    alert("From server: " + response.getReturnValue());
                }
            }
            // other state handling omitted for brevity
        });

        $A.enqueueAction(action);
    }
})

The component wired to the client-side controller is passed into the doSomething action as the cmp parameter. When cmp.get("v.displayResult) is called, we don’t need a cmp.isValid() check.

However, if you hold a reference to another component that may not be valid despite your component being valid, you might need a cmp.isValid() check for the other component. Let’s look at another example of a component that has a reference to another component with a local ID of child.

({
    "doSomething" : function(cmp) {
        var action = cmp.get("c.serverEcho");
        var child = cmp.find("child");
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                if (child.get("v.displayResult)) {
                    alert("From server: " + response.getReturnValue());
                }
            }
            // other state handling omitted for brevity
        });

        $A.enqueueAction(action);
    }
})

This line in the previous example without the child component:

if (cmp.get("v.displayResult)) {

changed to:

if (child.get("v.displayResult)) {

You don’t need a child.isValid() call here as child.get("v.displayResult) will return null if the child component is invalid. Add a child.isValid() check only if you’re making multiple calls against the child component and you want to avoid a null check for each result.

Outside the Framework Lifecycle

If you reference a component in asynchronous code, such as setTimeout() or setInterval(), or when you use Promises, a cmp.isValid() call checks that the component is still valid before processing the results of the asynchronous request. In many scenarios, the cmp.isValid() call isn’t necessary because a null check on a value retrieved from cmp.get() is sufficient. The main reason to call cmp.isValid() is if you’re making multiple calls against the component and you want to avoid a null check for each result.

For example, you don’t need a cmp.isValid() check within this setTimeout() call as the cmp.set() call doesn’t do anything when the component is invalid.

window.setTimeout(
    $A.getCallback(function() {
        cmp.set("v.visible", true);
    }), 5000
);