User profile menu function not working for freya theme

[Francesco.Tran]

Hello,

I am trying to use the freya theme and I modified the user menu in the file AppTopBar.vue like so:

Code: Select all

[...]
<li ref="profile" class="topbar-item user-profile" :class="{'active-topmenuitem fadeInDown': topbarUserMenuActive}">
            <a @click="onTopbarUserMenuClick">
              <img src="assets/layout/images/avatar.jpeg" alt="freya-layout"/>
            </a>
            <ul class="fadeInDown">
              <li>
                <a @click="logout">
                  <span>Logout</span>
                </a>
              </li>
            </ul>
</li>
[...]

However when I click on the button the function doesn't get called.

Code: Select all

methods: {
    [..]
    logout() {
      console.log("Clicked logout");
    }
}    

Can you explain me what am I doing wrong? Thank you.

[Francesco.Tran]

Actually the strange part is that sometimes it gets executed, after clicking multiple times.

[Francesco.Tran]

I noticed the same issue on the live theme on the store: if I am not on the main page I should be able to click on any menu item and it should bring me back to "#" but often it's not working.

Code: Select all

<ul class="fadeInDown">
                            <li>
                                <a href="#">
                                    <span>Profile</span>
                                </a>
                            </li>
                            <li>
                                <a href="#">
                                    <span>Settings</span>
                                </a>
                            </li>
                            <li>
                                <a href="#">
                                    <span>Messages</span>
                                </a>
                            </li>
                            <li>
                                <a href="#">
                                    <span>Notifications</span>
                                </a>
                            </li>
                        </ul>

[tugce.kucukoglu]

Hello,

I tried it like you said above and when I clicked the a tag ( not the li tag ) the page goes to '/#/' every time not sometimes.

If the problem is still persist please add a codesandbox link but please do not share the Freya code.