Beego模板相關用法

時間 2019-11-09

標籤 beego 模板相關用法简体版

原文原文鏈接

一、建立beeblog項目

➜  go pwd
/Users/daixuan/qbox/go
➜  go bee new beeblog
______
| ___ \
| |_/ /  ___   ___
| ___ \ / _ \ / _ \
| |_/ /|  __/|  __/
\____/  \___| \___| v1.10.0
2018/07/29 17:20:41 WARN     ▶ 0001 You current workdir is not inside $GOPATH/src.
2018/07/29 17:20:41 INFO     ▶ 0002 Creating application...
    create   /Users/daixuan/qbox/go/src/beeblog/
    create   /Users/daixuan/qbox/go/src/beeblog/conf/
    create   /Users/daixuan/qbox/go/src/beeblog/controllers/
    create   /Users/daixuan/qbox/go/src/beeblog/models/
    create   /Users/daixuan/qbox/go/src/beeblog/routers/
    create   /Users/daixuan/qbox/go/src/beeblog/tests/
    create   /Users/daixuan/qbox/go/src/beeblog/static/
    create   /Users/daixuan/qbox/go/src/beeblog/static/js/
    create   /Users/daixuan/qbox/go/src/beeblog/static/css/
    create   /Users/daixuan/qbox/go/src/beeblog/static/img/
    create   /Users/daixuan/qbox/go/src/beeblog/views/
    create   /Users/daixuan/qbox/go/src/beeblog/conf/app.conf
    create   /Users/daixuan/qbox/go/src/beeblog/controllers/default.go
    create   /Users/daixuan/qbox/go/src/beeblog/views/index.tpl
    create   /Users/daixuan/qbox/go/src/beeblog/routers/router.go
    create   /Users/daixuan/qbox/go/src/beeblog/tests/default_test.go
    create   /Users/daixuan/qbox/go/src/beeblog/main.go
2018/07/29 17:20:41 SUCCESS  ▶ 0003 New application successfully created!
➜  go ll /Users/daixuan/qbox/go/src
total 0
drwxr-xr-x  10 daixuan  staff   320 Jul 29 17:20 beeblog

二、自定義數據結構

➜  beeblog vim /Users/daixuan/qbox/go/src/beeblog/controllers/default.go
package controllers

import (
    "github.com/astaxie/beego"
)

type MainController struct {
    beego.Controller
}

func (c *MainController) Get() {
    c.Data["Website"] = "beego.me"
    c.Data["Email"] = "astaxie@gmail.com"
    c.TplName = "index.tpl"
    c.Data["TrueCond"] = true
    c.Data["FalseCond"] = false
//添加一個結構
    type u struct{
        Name string
        Age int
        Sex string
    }
    user := &u{
        Name: "Joe",
        Age: 20,
        Sex: "Male",
    }
    c.Data["User"] = user
}

➜  beeblog vim /Users/daixuan/qbox/go/src/beeblog/views/index.tpl
<body>
  <header>
    <h1 class="logo">Welcome to Beego</h1>
    <div class="description">
      Beego is a simple & powerful Go web framework which is inspired by tornado and sinatra.
    </div>
  </header>
  <footer>
    <div class="author">
      Official website:
      <a href="http://{{.Website}}">{{.Website}}</a> /
      Contact me:
      <a class="email" href="mailto:{{.Email}}">{{.Email}}</a>
      <a class="email" href="mailto:{{.User}}">{{.User}}</a>
    </div>
  </footer>
  <div class="backdrop"></div>
  <div>
  {{if .TrueCond}}
    true condition
  {{end}}
  </div>

  <div>
  {{if .FalseCond}}
  {{else}}
    false condition.
  {{end}}
  </div>

  <div>
  {{.User.Name}}; {{.User.Age}}; {{.User.Sex}}
  </div>

  <script src="/static/js/reload.min.js"></script>
</body>

三、with end使用

注意：爲了解決循環嵌套的問題，能夠使用with end的方式css

<div>
  {{.User.Name}}; {{.User.Age}}; {{.User.Sex}}
  </div>
    這段代碼能夠修改成以下，效果相同：
  <div>
  {{with .User}}
  {{.Name}}; {{.Age}}; {{.Sex}}
  {{end}}
  </div>

➜ beeblog bee run beeblog
訪問：http://localhost:8080/
html

四、range使用

default.go 添加：
    nums := []int{1,2,3,4,5,6,7,8,9,0}
    c.Data["Nums"] = nums

index.tpl中添加：
 <div>
  {{.Nums}}
  </div>

  <div>
  {{range .Nums}}
  {{.}}
  {{end}}
  </div>

訪問：http://localhost:8080/
git

五、自定義模板

default.go 添加：
    c.Data["TplVar"] = "hey guys"

index.tpl中添加：
  <div>
  {{$tplVar := .TplVar}}
  {{$tplVar}}
  </div>

訪問：http://localhost:8080/
github

六、beego內置模板函數使用，以字符串轉html模板函數

beego中寫的任意html的代碼，它都會自動編碼web

default.go 添加：
        c.Data.["Html"]="<div>hello beego</div>" 

index.tpl中添加：
  <div>
  {{.Html}}
  </div>

訪問：http://localhost:8080/ 返回：<div>hello beego</div>，怎麼以html格式顯示呢？
vim

index.tpl中：
    <div>
  {{.Html}}
  </div>
    修改成以下便可：
      <div>
  {{str2html .Html}}
  </div>

再訪問：http://localhost:8080/ 結果：
數據結構

七、pipeline使用（查看數據格式）

default.go 添加：
            c.Data["Pipe"] = "<div>hello beego</div>"

index.tpl中添加：
  <div>
    {{.Pipe | htmlquote}}
  </div>

訪問：http://localhost:8080/ 結果：
返回：<div>hello beego</div>
app

八、模板嵌套（相似函數調用）

<div>
    {{template "test"}}
  </div>

  <script src="/static/js/reload.min.js"></script>
</body>
</html>

{{define "test"}}
<div>
  this is test template
</div>
{{end}}

訪問：http://localhost:8080/ 結果：
ide