在节点 js 中渲染页面而不重新加载部分

Question

How to reload the page without reload partials in node js. I am creating a web application using node js, bootstrap, mongodb and handlebars. In my partial navbar the active class and js code for changing it into clicked component. when I render a page inside this the whole document is reloading and active class changing is uneffective in this case. I think it will be fixed with avoid reloading partials. There is any way to avoid reloading partials when page rendered.

Answer 1

I'm working on assumptions here as you haven't posted any code, I assume that:

• You are using Handlebars to render the partials on your Server? (not on the client)
• You have setup separate routes on NodeJS (are you using express?) so each route serves a different page, eg "/Index", "/About", "/Privacy", "/Contact" etc.

If my assumptions are true, each route on your server is providing an entire web page. It must re-load the partial because the client expects a complete html page for that route, and whenever the client changes route the server must provide a new page; if it didn't reload the partial then your navbar would be missing.

If you want a more seamless experience where the navbar stays there and you can modify its state, and only the remainder of the page reloads, you ought to try the Single Page Application approach. Frameworks such as Angular, React, VueJS or Svelte are designed with this approach in mind. Your routing and page templating is done client-side rather than server-side, but you can use a combination of both (I use Handlebars and VueJS)