node使用art-template生成静态页面
art-template页面模板
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>{{title}}{{top}}</title> <link rel='stylesheet' type='text/css' href="../views/main.css"></link> </head> <body> <button class="top-button">我要留言</button> //这里的语法跟vue有点类似，具体看art-template文档 https://aui.github.io/art-template/docs/ <h2>{{header}}</h2> {{each files}} <div class="box"> <p title={{$value.message}}>{{$value.name}}说：{{$value.message}}</p> <p>{{$value.date}}</p> <button class="delet"><a href="<%= $value.Id%>.html?Id=<%= $value.Id%>">Delete</a></button> </div> {{/each}} </body> </html> <script src="../views/main.js"></script>
node操作传值给页面
const fs = require('fs')
const template = require("art-template"); //引用art-template模板引擎
let listdata = [
{ Id: 6, name: '爱豆1', message: '士大夫敢死队风格', date: '2019-09-14' },
{ Id: 7, name: '米', message: '米米', date: '2019-09-16' },
{ Id: 8, name: '张宝', message: '第三方公司的', date: '2019-09-17' },
{ Id: 10, name: 'REACT', message: '大家好大家好', date: '2019-09-17' },
{ Id: 11, name: '是德国', message: '尔特瑞特为人我', date: '2019-09-18' },
{Id: 13,name: '他也认同',message: '复合体特反感风波不断的',date: '2019-10-14' }]
fs.readFile(path.join(views, "view.html"), function(err, data) {
let htmlstr = template.render(data.toString(), {
top: "标题-关键字",
header: "评论日志",
title: "list",
files: listdata
});
fs.writeFile('page/ss.html',htmlstr,function(error){
if(error){
console.log(error)
return false
}
console.log('成功')
})
})
