Beego 学习笔记15:布局页面
页面布局
1> 一个html页面由:head部分,body部分,内部css,内部js,外联css,外联的js这几部分组成。因此,一个布局文件也就需要针对这些进行拆分。

2> 新建一个layout.go的控制器。编写一个引用布局文件的实例。具体代码如下:
package controllers import (
"github.com/astaxie/beego"
) type LayoutController struct {
beego.Controller
}
//登录页面
func (c *LayoutController) Get() {
//布局页面
c.Layout = "layout.html"
//内容页面
c.TplName = "content.html"
//其他的部分
c.LayoutSections = make(map[string]string)
//页面使用的css部分
c.LayoutSections["HtmlHead"] = "head.tpl"
//页面使用的js部分
c.LayoutSections["Scripts"] = "scripts.tpl"
//页面的补充部分,可做为底部的版权部分时候
c.LayoutSections["SideBar"] = "sidebar.tpl"
}
3> 新建布局页面,具体的如下图所示

4> 在路由器中添加代码,编译运行项目,修订错误,查看运行的效果
5> 运行效果如下:

6> Layout.html具体的代码如下:
<!DOCTYPE html>
<html>
<head>
<title>布局页面</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css"/>
<link rel="stylesheet" href="/static/bootstrap/css/bootstrap-theme.min.css"/>
<script type="text/javascript" src="/static/js/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="/static/bootstrap/js/bootstrap.min.js"></script>
{{.HtmlHead}}
</head>
<body> <div class="container">
{{.LayoutContent}}
</div>
<div class="sidebar">
{{.SideBar}}
</div>
{{.Scripts}}
</body>
</html>
7> 这周的Beego学习笔记将不会更新了。我再想想还有那些需要记录学习点。
Beego 学习笔记15:布局页面的更多相关文章
- Beego学习笔记
Beego学习笔记 Go 路由(Controller) 路由就是根据用户的请求找到需要执行的函数或者controller. Get /v1/shop/nike ShopController Get D ...
- Beego 学习笔记14:Session控制
Session控制 1> Session常用来作为全局变量使用,比如记录当前登录的用户,或者页面之间传递数据使用. 2> Beego框架内置了 session 模块,目前 ...
- Beego学习笔记——Logs
日志处理 这是一个用来处理日志的库,它的设计思路来自于database/sql,目前支持的引擎有file.console.net.smtp,可以通过如下方式进行安装: go get github.co ...
- 【swift学习笔记】二.页面转跳数据回传
上一篇我们介绍了页面转跳:[swift学习笔记]一.页面转跳的条件判断和传值 这一篇说一下如何把数据回传回父页面,如下图所示,这个例子很简单,只是把传过去的数据加上了"回传"两个字 ...
- Ext.Net学习笔记15:Ext.Net GridPanel 汇总(Summary)用法
Ext.Net学习笔记15:Ext.Net GridPanel 汇总(Summary)用法 Summary的用法和Group一样简单,分为两步: 启用Summary功能 在Feature标签内,添加如 ...
- Beego学习笔记——Config
配置文件解析 这是一个用来解析文件的库,它的设计思路来自于database/sql,目前支持解析的文件格式有ini.json.xml.yaml,可以通过如下方式进行安装: go get github. ...
- Beego学习笔记——开始
beego简介 beego是一个快速开发Go应用的http框架,他可以用来快速开发API.Web.后端服务等各种应用,是一个RESTFul的框架,主要设计灵感来源于tornado.sinatra.fl ...
- SQL反模式学习笔记15 分组
目标:查询得到每组的max(或者min等其他聚合函数)值,并且得到这个行的其他字段 反模式:引用非分组列 单值规则:跟在Select之后的选择列表中的每一列,对于每个分组来说都必须返回且仅返回一直值. ...
- 并发编程学习笔记(15)----Executor框架的使用
Executor执行已提交的 Runnable 任务的对象.此接口提供一种将任务提交与每个任务将如何运行的机制(包括线程使用的细节.调度等)分离开来的方法.通常使用 Executor 而不是显式地创建 ...
随机推荐
- Android: Error inflating class android.support.v4.view.ViewPager 问题的解决方法
ViewPager是个很好很强大的控件,很多应用用它来实现很酷的效果,但是很多情况下在运行时会遇到Error inflating class android.support.v4.view.ViewP ...
- Helm 安装Kafka
helm镜像库配置 helm repo add stable http://mirror.azure.cn/kubernetes/charts helm repo add incubator http ...
- Python实现终端FTP文件传输
实现终端FTP文件传输 代码结构: .├── client.py├── readme.txt└── server.py 运行截图: readme.txt tftp文件服务器 项目功能: * 客户端有简 ...
- java登录图形界面
编写程序,利用JtextField和JpasswordField分别接收用户输入的用户名和密码,并对用户输入的密码进行检验.对于每个用户名有三次密码输入机会. package beizi; impor ...
- vultr的防火墙注意事项
如下图所示,你设置让任意IP的TCP,UDP,GRE,ESP,ICMP都允许访问,并不表示开放了任意协议和端口了. 下图只是表示开放了TCP,UDP,GRE,ESP,ICMP五个协议,比如ROS路由的 ...
- 第6课 nullptr_t和nullptr
一. nullptr与nullptr_t (一)nullptr_t是一种数据类型,而nullptr是该类型的一个实例.通常情况下,也可以通过nullptr_t类型创建另一个新的实例. (二)所有定义为 ...
- sde.layers表的eflags字段解析
ArcSDE地理数据库,虽然经常在用,但仅限于了解功能层面的东西,其内部实现机制对我来说是个黑盒子.因为想了解register with geodatabase操作在数据库层面到底发生了什么,我分析了 ...
- 树莓派4B基本配置
一.系统安装 官网下载好系统解压,使用SD Card Formatter格式化内存卡 # 查看内存卡状态,通过内存卡大小判断是哪个 df -lh # 卸载内存卡 diskutil unmount /d ...
- ng打包
1.在项目完成后进行项目打包 2.输入ng build后会出现dist打包文件 3.在打包文件中有一个文件index.html文件,改变html中的一个参数 <base href="/ ...
- [转帖]k8s 部署问题解决
k8s 部署问题解决 https://www.jianshu.com/p/f53650a85131 本文记录一下在部署 k8s 时遇到的一些问题及解决方法,具体部署流程可以参考 ubuntu 安装 k ...