在线客服系统源码开发实战总结：gin框架模板渲染html页面

渲染模板

我的客服系统后端使用的golang Gin 框架，想把页面渲染出来，下面就是加载html模板页面

代码语言：javascript复制

package router

func InitViewRouter(engine *gin.Engine) {

    //关于页面
    engine.GET("/aboutus.html", func(c *gin.Context) {
        c.HTML(http.StatusOK, "aboutus.html", gin.H{
            "nav": "aboutus",
        })
    })
    //演示页面
    engine.GET("/show.html", func(c *gin.Context) {
        c.HTML(http.StatusOK, "show.html", gin.H{
            "nav": "show",
        })
    })

}

分配的模板变量nav ，是为了前端导航部分，可以实现选中当前页面的效果

因为导航条部分，我提取到了公共页面里。

模板公共部分

当使用gin进行模板渲染的时候

如果想要头部或者底部是公用的，那么可以这样做

比如模板部分

index.html

footer.html

index.html里面

代码语言：javascript复制

{{template "footer" .}}

footer.html里面

代码语言：javascript复制

{{define "footer"}}
    </body>

    </html>
{{ end }}

模板判断

导航部分，需要判断分配的模板变量，实现当前选中页面效果。.nav就是分配过来的变量

代码语言：javascript复制

                <li class="nav-item {{if eq .nav "show"}}on{{end}}">
                    <a href="/show.html" target="_blank">线上功能演示</a>
                </li>
                <li class="nav-item {{if eq .nav "aboutus"}}on{{end}}">
                    <a href="/aboutus.html" target="_blank">关于产品</a>
                </li>

可以看到导航部分的效果，参考演示页面 演示页面-唯一在线客服系统

html 渲染 编程算法

0 人点赞