React SPA page with Sling Selector fails to load the page content | Community
Skip to main content
B
bfvaughn
Level 3
January 14, 2022
Solved

React SPA page with Sling Selector fails to load the page content

  • January 14, 2022
  • 2 replies
  • 1055 views

I need to handle a dynamic url where the last three url paths are variables. I have a url like /content/mysite/us/en/home/product/tools/var1/var2/var3 that I can transform to /content/mysite/us/en/home/product/tools.var1.var2.var3.html via /etc/maps. The Sling model is building the correct model.json with all the json elements you'd expect but the page is loading blank and no errors are thrown in the console. Any ideas where in the react spa code this would be failing?

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by bfvaughn

I found the resolution.  I needed to extend the page's Sling Model and override getExportedPath() to include the selectors.  This allowed the React code to map the current page to the model.json and display the content for the page.

2 replies

VeenaVikraman
Community Advisor
VeenaVikramanCommunity Advisor
Community Advisor
January 17, 2022
@bfvaughn wrote:

I need to handle a dynamic url where the last three url paths are variables. I have a url like /content/mysite/us/en/home/product/tools/var1/var2/var3 that I can transform to /content/mysite/us/en/home/product/tools.var1.var2.var3.html via /etc/maps. The Sling model is building the correct model.json with all the json elements you'd expect but the page is loading blank and no errors are thrown in the console. Any ideas where in the react spa code this would be failing?

Hi @bfvaughn 

 

   Could you check the error logs ? Because in this case the issue could be with the sling resolution . If you check the error logs, you will be able to see exactly why the page is coming empty. Sometimes it might be because Sling is not able to find the correct renderer for the URL. So once you have the logs, could you please paste it back here , so that someone can check the same and respond back with the resolution.

 

   When you say, you can transform /content/mysite/us/en/home/product/tools/var1/var2/var3 to /content/mysite/us/en/home/product/tools.var1.var2.var3.html

    B
    bfvaughnAuthorAccepted solution
    Level 3
    January 17, 2022

    I found the resolution.  I needed to extend the page's Sling Model and override getExportedPath() to include the selectors.  This allowed the React code to map the current page to the model.json and display the content for the page.

      Terms & ConditionsAccessibility statement

      Loading footer...