页面布局

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：布局页面的更多相关文章

  1. Beego学习笔记

    Beego学习笔记 Go 路由(Controller) 路由就是根据用户的请求找到需要执行的函数或者controller. Get /v1/shop/nike ShopController Get D ...

  2. Beego 学习笔记14：Session控制

    Session控制 1>     Session常用来作为全局变量使用,比如记录当前登录的用户,或者页面之间传递数据使用. 2>     Beego框架内置了 session 模块,目前 ...

  3. Beego学习笔记——Logs

    日志处理 这是一个用来处理日志的库,它的设计思路来自于database/sql,目前支持的引擎有file.console.net.smtp,可以通过如下方式进行安装: go get github.co ...

  4. 【swift学习笔记】二.页面转跳数据回传

    上一篇我们介绍了页面转跳:[swift学习笔记]一.页面转跳的条件判断和传值 这一篇说一下如何把数据回传回父页面,如下图所示,这个例子很简单,只是把传过去的数据加上了"回传"两个字 ...

  5. Ext.Net学习笔记15：Ext.Net GridPanel 汇总(Summary)用法

    Ext.Net学习笔记15:Ext.Net GridPanel 汇总(Summary)用法 Summary的用法和Group一样简单,分为两步: 启用Summary功能 在Feature标签内,添加如 ...

  6. Beego学习笔记——Config

    配置文件解析 这是一个用来解析文件的库,它的设计思路来自于database/sql,目前支持解析的文件格式有ini.json.xml.yaml,可以通过如下方式进行安装: go get github. ...

  7. Beego学习笔记——开始

    beego简介 beego是一个快速开发Go应用的http框架,他可以用来快速开发API.Web.后端服务等各种应用,是一个RESTFul的框架,主要设计灵感来源于tornado.sinatra.fl ...

  8. SQL反模式学习笔记15 分组

    目标:查询得到每组的max(或者min等其他聚合函数)值,并且得到这个行的其他字段 反模式:引用非分组列 单值规则:跟在Select之后的选择列表中的每一列,对于每个分组来说都必须返回且仅返回一直值. ...

  9. 并发编程学习笔记(15)----Executor框架的使用

    Executor执行已提交的 Runnable 任务的对象.此接口提供一种将任务提交与每个任务将如何运行的机制(包括线程使用的细节.调度等)分离开来的方法.通常使用 Executor 而不是显式地创建 ...

随机推荐

  1. 【Hadoop】CDH、Presto配置问题

    1.hive.properties配置如下 connector.name=hive-hadoop2 hive.metastore.uri=thrift://node001.XXXX.com:9083 ...

  2. python基础之三：int、bool、str

    一.数据类型之整型的函数使用 i = print("该整型数字所占有效比特位的长度是:%d" % i.bit_length()) print(i.to_bytes(, " ...

  3. First Chance Exception是什么？

    是否调试过应用程序并在输出窗口中看到有关“First Chance”异常的消息?有没有想过: 什么是First Chance Exception? 第一次机会异常是否意味着我的代码中存在问题? 在调试 ...

  4. 二分查找java实现

    二分查找也称折半查找(Binary Search),它是一种效率较高的查找方法.但是,折半查找要求线性表必须采用顺序存储结构,而且表中元素按关键字有序排列. 二分查找思路非常简单,由粗暴的遍历查找改为 ...

  5. 动态规划大合集II

    1.前言 大合集总共14道题,出自江哥之手(这就没什么好戏了),做得让人花枝乱颤.虽说大部分是NOIP难度,也有简单的几道题目,但是还是做的很辛苦,有几道题几乎没思路,下面一道道边看边分析一下. 2. ...

  6. gcd与exgcd

    gcd 辗转相除法求gcd证明 \(gcd(a, b) == gcd(b, a\%b)\) 证明: 设: \(d\)为\(a\)与\(b\)的一个公约数, 则有\(d|b\) \(d|a\) 设: \ ...

  7. 【meet in the mid】【qbxt2019csp刷题班day1C】birthday

    Description 给定一个长度为 \(n\) 序列,值域为 \([1, v]\),每次选择一段区间,要求在这个区间上选择一些元素加入到两个集合中,每个元素要么不选要么只能加入一个集合,要求两个集 ...

  8. python基础_格式化输出（%用法和format用法）(转载)

    python基础_格式化输出(%用法和format用法) 目录 %用法 format用法 %用法 1.整数的输出 %o -- oct 八进制%d -- dec 十进制%x -- hex 十六进制 &g ...

  9. spark基础知识二

    主要围绕spark的底层核心抽象RDD进行理解.主要包括以下几个方面 RDD弹性分布式数据集的概念 RDD弹性分布式数据集的五大属性 RDD弹性分布式数据集的算子操作分类 RDD弹性分布式数据集的算子 ...

  10. Elasticsearch的null values

    很多时候,我们需要面临null值的烦扰,查询es时传入null值是要查询出null的数据还是不查这个field呢,稍有不慎就会引发新的bug,这的确是个问题! null_value 意味着无法索引或搜 ...