Vue Routing with AEM

Avatar

Avatar

sateeshk9319722

Avatar

sateeshk9319722

sateeshk9319722

13-08-2020

Hello all,

How to use routing of vue js in AEM.

Use Case: We have a component called "Login" , I want to load one more component if the user logged in successfully

FYI: The Vue components are integrated with AEM and we are loading the AEM components on the page.

 

Many thanks. 

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Avatar

ChitraMadan

MVP

Avatar

ChitraMadan

MVP

ChitraMadan
MVP

13-08-2020

Hi @sateeshk9319722,

 

May be you can try to trigger event from 1 view to another.

 

So, when a user logs in, you can fire the event which the other view/component will be listening to.

You can refer to this article https://www.danvega.dev/blog/2019/06/05/triggering-events-router-vue/

 

We did something similar to this using broadcasts in angular js. May be you can try on the same lines.

function postUserLoggedIn(options) {
$rootScope.$broadcast('userLoggedIn');
$window.parent.postMessage({
action: 'userLoggedIn',
profile: options.profile,
idToken: options.idToken || undefined
}, '*');
 
$scope.$on('userLoggedIn', function () {
$scope.isLoggedIn = true;
fillUserDetails();
});
}

 

 

Answers (2)

Answers (2)

Avatar

Avatar

SundeepKatepally

Avatar

SundeepKatepally

SundeepKatepally

13-08-2020

Does contexthub solves your use case  ? based on a defined segment (in your case user logged in) you will show the component else not.

Avatar

Avatar

vanegi

Employee

Avatar

vanegi

Employee

vanegi
Employee

13-08-2020