基于类似的问题和我所看到的,Electron 中没有内置的 html 模板语言,这实际上很棒,因为它允许您使用任何其他模板语言。
我目前正在 Electron 中使用ejs。下面是我的index.ejs模板文件:
<html lang="en">
<head>
<title>The Index Page</title>
</head>
<body>
<h1>Welcome, this is the Index page.</h1>
<% if (user) { %>
<h3>Hello there <%= user.name %></h3>
<% } %>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
下面是我的文件的一部分main.js,其中上面的模板被渲染并加载到BrowserWindow. 请注意,我省略了大部分样板代码:
const ejs = require('ejs');
//... Other code
let win = new BrowserWindow({width: 800, height: 600});
//... Other code
// send the data and options to the ejs template
let data = {user: {name: "Jeff"}};
let options = {root: __dirname};
ejs.renderFile('index.ejs', data, options, function (err, str) {
if (err) {
console.log(err);
}
// Load the rendered HTML to the BrowserWindow.
win.loadURL('data:text/html;charset=utf-8,' + encodeURI(str));
});
Run Code Online (Sandbox Code Playgroud)
我会赞扬这个要点,因为它帮助我找到了data:text/html;charset=utf-8可用于加载动态内容的 url 部分。
更新
我实际上不再使用这个了。加载默认 html 并使用本机 DOM 方法会更快。Electron Quickstart程序展示了如何很好地做到这一点。
| 归档时间: |
|
| 查看次数: |
15476 次 |
| 最近记录: |