線上客服系統源碼開發實戰總結：gin框架模板渲染html頁面

渲染模板

我的客服系統後端使用的golang Gin 框架，想把頁面渲染出來，下麵就是載入html模板頁面

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裡面

{{template "footer" .}}

footer.html裡面

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

    </html>
{{ end }}

模板判斷

導航部分，需要判斷分配的模板變數，實現當前選中頁面效果。.nav就是分配過來的變數

                <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>

可以看到導航部分的效果，參考演示頁面 演示頁面-唯一線上客服系統

十年開發經驗程式員，離職全心創業中，歷時三年開發出的產品《唯一客服系統》