更新数据而不刷新页面pug nodejs

Question

我是哈巴狗的新手，我已经阅读了文档，并且正在寻找解决方法。

我有动态菜单，当用户选择菜单时，需要将相关信息加载到页面中。

例如：

• Item1
• Item2
• Item3
• 第4项

如果我单击这些项目之一，则无论您单击哪个，它都将导航到“ localhost / item2”或“ localhost / item1”。

我知道如果我创建一条路由，让它说“ p”，那么它将是“ localhost / p / item2”或“ localhost / p / item1”，我可以使用p/处理所有这些请求并使用item2或item1以获得相关数据

我想做的是有一个不会更新的标头，但会更改和更新所选信息的“正文”。

有没有办法做到这一点？

//- index.pug
doctype html
html
  include includes/head.pug
  body
    h1 My Site
    p Welcome to my super lame site.
    include includes/foot.pug

是否可以在不重新呈现页面的情况下“重新加载/刷新”包含内容？

我还认为也许可以将信息传递到服务器上的JavaScript页面，但是我只知道如何直接与pug模板进行通信。

Answer 1

如果我正确理解了您要实现的目标，那么Angular，React或VueJS等SPA正是为您服务的，因此，我强烈考虑使用其中一种。

尽管如此，在那些框架的作用下，只是使用jquery来相应地更新DOM，以响应前端或后端发出的事件。 如果您要在没有任何框架帮助的情况下进行此操作（强烈建议您，您的时间将比学习一个框架好得多，而不是模仿其行为），那么您应该有适当的来回沟通方式（即：socket.io），然后在前端中添加一个相应的js，以通知后端发生在前端的操作或从后端解析事件并做出响应。

我希望这对您有帮助