Go基礎學習記錄之Web開發的部落格文章列表展示功能
每次我都會將自己實踐的程式碼放到github上並且都會打一個tag,方便後面用的同學使用,這裡我以下面分支的程式碼進行實踐分享
https://github.com/durban89/typescript_demo.git tag: 1.1.5
本次分享繼續之前的Model層,之前的Model層重構,零零散散的總算是完成了,今天繼續新增一下文章列表展示功能,雖然說是一個簡單的列表展示,但是也還是耗費了很長的時間
過程很簡單,先簡單說下,後面說下具體的難點
第一步、新增控制層
新增一個控制器函式ArticleItem,用來展示呼叫文章的列表資料並給到前端進行展示。程式碼如下
// ArticleItem 列表 func ArticleItem(w http.ResponseWriter, r *http.Request) { var blogModel models.BlogModel var autokid int64 var title string selectField := models.SelectValues{ "autokid": &autokid, "title":&title, } where := models.WhereValues{} qr, err := blogModel.Query(selectField, where, 0, 10) if err != nil { fmt.Println(err) http.NotFound(w, r) return } t, err := template.ParseFiles(config.TemplateDir + "/item.html") if err != nil { http.Error(w, err.Error(), http.StatusInternalServerError) return } err = t.Execute(w, struct { Data []models.SelectResult }{ Data: qr, }) if err != nil { http.Error(w, err.Error(), http.StatusInternalServerError) return } }
第二步、View層修改
這裡我們需要新增一個檢視檔案templates/item.html,裡面的程式碼如下
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <title>列表</title> <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> <link rel="stylesheet" href="https://fezvrasta.github.io/bootstrap-material-design/docs/4.0/examples/blog/blog.css" crossorigin="anonymous" /> </head> <body> <div class="container"> <div class="row"> <div class="col-md-9"> <h3 class="pb-3 mb-4 font-italic border-bottom"> From the Firehose </h3> {{range .Data}} <div class="blog-post"> <h2 class="blog-post-title">{{ .autokid }} - {{ .title }} blog post</h2> <p class="blog-post-meta">January 1, 2014 by <a href="#">Mark</a></p> </div> {{end}} <nav class="blog-pagination"> <a class="btn btn-outline-primary" href="#">Older</a> <a class="btn btn-outline-secondary disabled" href="#">Newer</a> </nav> </div> <div class="col-md-3"> RightSidebar </div> </div> </div> <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> <script src="https://cdn.bootcss.com/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script> <script src="https://cdn.bootcss.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script> </body> </html>
第三步、路由新增
修改routes/routes.go檔案如下路由
{ Path: "/item/", Fn:controllers.ArticleItem, },
新增後重新編譯並訪問/item就會看到如下類似的輸出
以上就是具體邏輯的輸出,不過這裡主要說下難點
如何在模板中對陣列型別的資料進行輸出,如下方式操作
{{range .Data}} <div class="blog-post"> <h2 class="blog-post-title">{{ .autokid }} - {{ .title }} blog post</h2> <p class="blog-post-meta">January 1, 2014 by <a href="#">Mark</a></p> </div> {{end}}
這個是剛才的檢視檔案中可以找到
並且我們在控制層也要有對應的引數傳遞,如下
err = t.Execute(w, struct { Data []models.SelectResult }{ Data: qr, })
Model層查詢功能工作失敗,由於反射機制使用錯誤,現已更改如下,前面的文章也會相應做修改
for k, v := range s { var ref = reflect.ValueOf(v) var refv = ref.Elem() if refv.Kind() == reflect.Int64 { tmpResult[k] = refv.Int() } else if refv.Kind() == reflect.String { tmpResult[k] = refv.String() } i++ }
這裡主要是進行判斷然後將值進行對應型別的轉換,不然跟之前的呼叫方式,其實賦值的只是一個指標的地址,當迴圈到最後一個的時候,全部的值都會程式設計一個值,這個時候就會看到獲取到的列表每組數值都是一樣的。
今天分享就到這裡,如果對反射機制不是很理解的話,可以去搜下,以前沒覺得golang有多火,其實只要搜尋下某個相關知識點那就回發現,很多文章在介紹次相關的知識。
專案更新地址
https://github.com/durban89/typescript_demo.git tag: 1.1.6