电子负载页眉/页脚

时间:2016-08-04 12:22:48

标签: electron

我对电子全新,但已经爱上了它!

但我只是想知道如何处理不同页面的应用程序。 我无法为每个页面编写单个.html文件,因为当标题中的某些内容发生更改时,我必须在每个.html文件中进行更改。

您更喜欢哪种解决方案?是否有代码片段?

2 个答案:

答案 0 :(得分:1)

我曾创建this. 您可以在<div>之外添加标头。它将始终可见,如果您想更改标题,则只需更改一次。

答案 1 :(得分:0)

https://jsfiddle.net/ovezbn4j/

此示例是一个典型的单页面应用程序,带有sidenav栏,允许您通过将'main'div中的html替换为适当的内容来人工导航应用程序。

由于你使用的是Electron,我建议使用那个小提琴作为指导,因为它是纯粹的javascript。

对于Electron应用程序的实际实现,您需要充分利用节点生态系统,特别是Angular和/或Handlebars,或具有类似单页应用程序功能的任何其他包。

let getHTML = pageName => {
  switch(pageName) {
    case 'home':
      return homePage;
      break;
    case 'create-user':
      return createUserPage;
      break;
    default:
      alert(`${pageName} does not exist!`);
      break;
  }
}

let homePage = '<p>This is the home page!</p>';
let createUserPage = '<p>This is the user creation page!</p>';

特别应该使用Handlebars通过引用和编译基于navBtn id的.hbs文件,然后将生成的html字符串插入主体来实现此片段。