1. 创建基础模板（layout.html）：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{.title}}</title>
{{block "styles" .}} {{end}}
</head>
<body>
<header>
<h1>{{.header}}</h1>
</header>
<section>
{{template "content" .}}
</section>
<footer>
<p>{{.footer}}</p>
</footer>
{{block "scripts" .}} {{end}}
</body>
</html>
在这个基础模板中，使用了{{block "blockName" .}} {{end}}语法定义了一些块，可以在子模板中替换这些块的内容。注意，{{template "content" .}}是用来引入子模板的。
2. 创建子模板（index.html）：
{{extend "layout.html"}}
{{define "styles"}}
<style>
/* Custom styles for this page */
body {
background-color: #f0f0f0;
}
</style>
{{end}}
{{define "content"}}
<h2>Welcome to the Home Page</h2>
<p>This is the main content of the home page.</p>
{{end}}
{{define "scripts"}}
<script>
// Custom scripts for this page
console.log("Page-specific scripts");
</script>
{{end}}
在子模板中，通过{{extend "layout.html"}}语法指定了基础模板，然后通过{{define "blockName"}} ... {{end}}语法替换了基础模板中对应的块。
3. 在Go代码中渲染模板：
package main
import (
"github.com/gogf/gf/frame/g"
"github.com/gogf/gf/net/ghttp"
)
func main() {
app := g.New()
// 注册路由
app.BindHandler("/", func(r *ghttp.Request) {
// 渲染模板
r.Render("index.html", g.Map{
"title": "My GoFrame App",
"header": "Welcome to My App",
"footer": "© 2023 My App",
})
})
// 启动Web服务器
app.Run()
}
在这个例子中，通过r.Render("index.html", g.Map{...})渲染了子模板，并传递了一些模板变量用于替换基础模板中的内容。
这是一个简单的模板布局的示例，你可以根据实际需求扩展和定制你的模板布局。使用模板布局可以有效地组织和管理你的前端代码，使得代码结构更加清晰和可维护。
转载请注明出处：http://www.zyzy.cn/article/detail/7617/GoFrame