gin模板渲染以及模板语法

2023-04-05  本文已影响0人  我是聪

c.HTML

在 Gin 框架中，c.HTML 是 gin.Context 上的方法，用于渲染 HTML 模板并将渲染后的 HTML 内容发送给客户端。

func (c *Context) HTML(code int, name string, obj interface{})

参数说明：

package main

import (
    "github.com/gin-gonic/gin"
)

func main() {
    r := gin.Default()

    // 加载 HTML 模板文件
    r.LoadHTMLGlob("templates/*")

    r.GET("/", func(c *gin.Context) {
        // 渲染 index.html 模板文件并发送给客户端
        c.HTML(200, "index.html", gin.H{
            "title": "Gin Web Framework",
        })
    })

    r.Run(":8080")
}

在这个例子中，当访问根路径 "/" 时，通过 c.HTML 方法渲染了名为 index.html 的模板文件，并将一个包含标题信息的 gin.H 对象作为模板渲染的数据。最后通过 c.HTML 方法将渲染后的 HTML 内容发送给客户端。

前端模板的if else语法

在 Gin 框架的前端模板中，使用的是 Go 模板引擎，其语法类似于标准的 Go 模板语法，包括了条件判断语法。

以下是 Gin 框架前端模板中的 if 和 else 语法介绍：

{{ if .condition1 }}
  <!-- 条件1满足时的内容 -->
{{ elseif .condition2 }}
  <!-- 条件2满足时的内容 -->
{{ else }}
  <!-- 所有条件都不满足时的内容 -->
{{ end }}

以下是一个在 Gin 框架前端模板中使用 if 和 else 进行条件判断的具体例子：

假设在前端模板中传入了一个名为 .IsLoggedIn 的布尔值变量，表示用户是否已登录，我们可以根据这个变量的值来展示不同的页面内容。

<!DOCTYPE html>
<html>
<head>
  <title>条件判断示例</title>
</head>
<body>
  <h1>欢迎访问我的网站</h1>

  {{ if .IsLoggedIn }}
    <!-- 如果用户已登录，显示欢迎信息 -->
    <p>欢迎您，{{ .Username }}！</p>
    <a href="/logout">退出登录</a>
  {{ else }}
    <!-- 如果用户未登录，显示登录按钮 -->
    <a href="/login">登录</a>
  {{ end }}
</body>
</html>

在上面的例子中，.IsLoggedIn 是一个布尔值变量，表示用户是否已登录，.Username 是一个字符串变量，表示登录用户的用户名。当 .IsLoggedIn 为 true 时，会显示欢迎信息和退出登录链接；当 .IsLoggedIn 为 false 时，会显示登录链接。

gin前端模板的range

在 Gin 框架的前端模板中，range 是用于迭代循环的语法，可以用于遍历切片、数组、映射等数据结构，并在模板中根据迭代的结果进行渲染。

range 语法的基本格式如下：

{{ range .Data }}
  <!-- 循环体 -->
{{ end }}

其中，.Data 是一个需要迭代的数据结构，可以是一个切片、数组、映射等。

在循环体内，可以使用 . 表示当前迭代的元素，也可以通过 .KeyName 的方式访问映射中的键值对。例如：

<!DOCTYPE html>
<html>
<head>
  <title>Range语法示例</title>
</head>
<body>
  <h1>用户列表</h1>

  <ul>
    {{ range .Users }}
      <li>{{ .Name }} - {{ .Age }} 岁</li>
    {{ end }}
  </ul>
</body>
</html>

在上面的例子中，.Users 是一个切片或数组，表示用户列表。通过 range 语法在模板中遍历 .Users 中的每个用户，然后使用 .Name 和 .Age 分别获取用户对象的姓名和年龄，并在模板中渲染成一个用户列表。

通过使用 range 语法，可以在 Gin 框架的前端模板中实现循环遍历数据，并根据迭代结果进行动态渲染，从而实现灵活的前端展示。

gin前端模板的with

在 Gin 框架的前端模板中，with 是用于在模板中设置当前上下文对象的语法，可以在模板中指定一个对象作为当前上下文，从而可以直接访问该对象的字段和方法。

with 语法的基本格式如下：

{{ with .Data }}
  <!-- 当前上下文中的字段和方法的访问 -->
{{ end }}

其中，.Data 是一个对象，可以是一个结构体、映射、指针等。在 with 语法的内部，可以直接访问当前上下文对象的字段和方法，无需再使用 . 符号进行前缀。

例如，假设有以下的数据结构定义：

type User struct {
    Name string
    Age  int
}
可以将 User 对象作为当前上下文，然后在模板中直接访问其字段和方法，例如：
<!DOCTYPE html>
<html>
<head>
  <title>With语法示例</title>
</head>
<body>
  <h1>用户信息</h1>

  {{ with .User }}
    <p>姓名：{{ .Name }}</p>
    <p>年龄：{{ .Age }} 岁</p>
  {{ end }}
</body>
</html>

在上面的例子中，.User 是一个 User 对象，通过 with 语法设置其为当前上下文，然后在模板中直接访问 .Name 和 .Age 字段，从而渲染用户信息。

通过使用 with 语法，可以在 Gin 框架的前端模板中设置当前上下文对象，从而方便地访问对象的字段和方法，简化模板中的语法

模板复用

{{template "default/page_header.html . }} 是Go语言的模板语法中的一个指令，用于在当前模板中引用另外一个模板文件。

具体解释如下：

<!DOCTYPE html>
<html>
<head>
    <title>{{.Title}}</title>
    <!-- 其他头部代码 -->
</head>
<body>
    <!-- 导航栏等页面头部内容 -->
</body>
</html>
其中，{{.Title}} 表示模板中的数据上下文中的 Title 字段。

然后，我们有多个页面需要包含这个页面头部，例如 home.html 和 about.html。

在 home.html 模板中，我们可以通过以下方式引用 page_header.html 模板：
{{template "default/page_header.html" .}}
<!-- 其他页面内容 -->
在 about.html 模板中，同样可以通过以下方式引用 page_header.html 模板：
{{template "default/page_header.html" .}}
<!-- 其他页面内容 -->

这样，home.html 和 about.html 页面都会包含 page_header.html 模板中的页面头部内容，从而实现了页面头部的复用。在渲染时，模板引擎会将当前模板的数据上下文传递给 page_header.html 模板，使得其中的 {{.Title}} 可以动态地渲染为当前页面的标题。

r.static

r.Static() 是 gin 路由引擎 (gin.RouterGroup) 中的一个方法，用于处理静态文件的路由。

r.Static() 方法可以用来将一个或多个目录下的静态文件提供给客户端，例如图片、CSS 文件、JavaScript 文件等。这样，当客户端请求这些静态文件时，gin 会自动查找指定目录下的文件并返回给客户端。

r.Static() 方法的语法如下：

func (r *RouterGroup) Static(relativePath, root string) gin.IRoutes

其中，relativePath 参数表示路由的相对路径，即客户端请求的 URL 路径，root 参数表示静态文件的根目录，即静态文件的物理路径。

以下是一个使用 r.Static() 方法的例子：

package main

import "github.com/gin-gonic/gin"

func main() {
    r := gin.Default()

    // 将 "/static" 路径映射到 "static" 目录下的静态文件
    r.Static("/static", "./static")

    r.Run(":8080")
}

在这个例子中，r.Static("/static", "./static") 将客户端请求的 URL 路径以 "/static" 开头的请求映射到当前目录下的 "static" 目录中的静态文件。例如，如果存在一个名为 "static/css/styles.css" 的文件，那么客户端请求 "/static/css/styles.css" 时，gin 会自动查找并返回该文件给客户端。

上一篇 下一篇

猜你喜欢

热点阅读