2

I am working on a Lightning Component which is being used as a header component in the Napili template. I am implementing a User details drop-down menu using standard lightning:buttonMenu with two lightning:menuItem(Profile, Logout). In the component's Js class, I was able to get the value of the buttonMenu, but I am not sure how to implement the functionality(clicking on Profile should open user profile and Logout should be able to logout the user successfully).

LtngCmp.cmp

<lightning:buttonMenu iconName="utility:down" name="Menu" alternativeText="Settings" iconSize="small" onselect="{! c.handleMenuSelect }">
                        <lightning:menuItem label="Profile" value="Profile"/>
                        <lightning:menuItem label="Logout" value="Logout"/>
</lightning:buttonMenu>

LtngCmpController.js

handleMenuSelect: function(cmp, event, helper) {
var selectedMenuItemValue = event.getParam("value");

How can I make the menu items navigate appropriately?

Please let me know of any available resources or ways implementation.

0

Use naviage to url functionality on click of each menu item:

<lightning:menuItem label="Profile" value="Profile" onfocus="{!c.goToProfile}"/>

Controller:

goToProfile:function(cmp,event,helper){
  helper.navigateToPage(profileURL);
}

Helper:

navigateToPage : function(url) {    
        var urlEvent = $A.get("e.force:navigateToURL");
        urlEvent.setParams({
            "url": url,
            "isredirect": true,
        });
        urlEvent.fire();        
    },
| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.