0

0

YII框架的布局是什么?YII框架如何定义布局?

幻夢星雲

幻夢星雲

发布时间:2025-08-04 22:01:01

|

192人浏览过

|

来源于php中文网

原创

yii框架中的布局是网站页面共用部分的模板,通常包含头部、底部、侧边栏等全局结构;2. 布局文件默认存放在 views/layouts/ 目录下,如 main.php,并通过 $content 变量嵌入具体视图内容;3. 可在 config/web.php 中配置全局 layout,或在控制器中设置 public $layout 属性指定特定布局;4. 在动作方法中可通过 $this->layout = 'layout_name' 临时更改布局,或设为 false 禁用布局;5. 推荐使用资产包(asset bundle)机制在布局中引入css和js,通过 appasset::register($this) 注册资源,并配合 $this->head() 和 $this->endbody() 输出资源链接;6. 资产包支持依赖管理、版本控制、文件合并压缩及cdn加载,提升性能和维护性。该机制实现了页面结构统一和代码复用,使前端资源管理更加高效和规范。

YII框架的布局是什么?YII框架如何定义布局?

YII框架中的布局,简单来说,就是你网站页面共用部分的“外壳”或者“模板”。它决定了你的网页内容(比如一个新闻详情页、一个产品列表页)在显示时,会被包裹在一个什么样的整体框架里。这个框架通常包含头部导航、底部版权信息、侧边栏,以及一些全局性的CSS和JavaScript引用。定义布局,就是告诉Yii你的内容应该被哪个“外壳”包裹,从而实现网站风格的统一和代码的复用。

解决方案

在YII框架中定义和使用布局,核心在于理解其约定和配置。

最常见的方式是创建一个布局文件,通常命名为

main.php
,并将其放置在
views/layouts/
目录下。在这个文件中,你会像写普通的HTML一样,构建你的页面结构,但关键一点是,你需要预留一个位置给
$content
变量。这个
$content
变量就是你的具体视图文件(比如
site/index.php
)渲染出来的HTML内容。

例如,一个基本的

views/layouts/main.php
可能会是这样:

<?php

/* @var $this \yii\web\View */
/* @var $content string */

use app\assets\AppAsset;
use yii\bootstrap4\Html;
use yii\bootstrap4\Nav;
use yii\bootstrap4\NavBar;

AppAsset::register($this);
?>
<?php $this->beginPage() ?>
<!DOCTYPE html>
<html lang="<?= Yii::$app->language ?>" class="h-100">
<head>
    <meta charset="<?= Yii::$app->charset ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <?php $this->registerCsrfMetaTags() ?>
    <title><?= Html::encode($this->title) ?></title>
    <?php $this->head() ?>
</head>
<body class="d-flex flex-column h-100">
<?php $this->beginBody() ?>

<header>
    <?php
    NavBar::begin([
        'brandLabel' => Yii::$app->name,
        'brandUrl' => Yii::$app->homeUrl,
        'options' => [
            'class' => 'navbar navbar-expand-md navbar-dark bg-dark fixed-top',
        ],
    ]);
    echo Nav::widget([
        'options' => ['class' => 'navbar-nav'],
        'items' => [
            ['label' => 'Home', 'url' => ['/site/index']],
            ['label' => 'About', 'url' => ['/site/about']],
            ['label' => 'Contact', 'url' => ['/site/contact']],
        ],
    ]);
    NavBar::end();
    ?>
</header>

<main role="main" class="flex-shrink-0">
    <div class="container">
        <!-- 这里就是 $content 的位置,具体视图的内容会在这里显示 -->
        <?= $content ?>
    </div>
</main>

<footer class="mt-auto py-3 bg-dark">
    <div class="container">
        <p class="float-left">&copy; My Company <?= date('Y') ?></p>
        <p class="float-right"><?= Yii::powered() ?></p>
    </div>
</footer>

<?php $this->endBody() ?>
</body>
</html>
<?php $this->endPage() ?>

定义好布局文件后,你需要告诉Yii你的应用或控制器应该使用哪个布局。

  1. 全局应用配置: 在你的

    config/web.php
    配置文件中,可以设置
    layout
    属性来指定整个应用默认使用的布局:

    'components' => [
        // ...
    ],
    'layout' => 'main', // 对应 views/layouts/main.php
    // 或者如果你想指定路径
    // 'layoutPath' => '@app/views/layouts',
    // 'layout' => 'main',

    这里

    main
    指的是
    views/layouts/main.php
    。Yii 会自动在
    layoutPath
    (默认为
    @app/views/layouts
    )下寻找名为
    main
    的文件。

  2. 控制器级别配置: 如果你希望某个控制器下的所有动作都使用特定的布局,可以在控制器类中设置

    layout
    属性:

    namespace app\controllers;
    
    use yii\web\Controller;
    
    class ProductController extends Controller
    {
        public $layout = 'product_layout'; // 对应 views/layouts/product_layout.php
    
        public function actionIndex()
        {
            return $this->render('index');
        }
    }
  3. 动作级别配置: 甚至你可以在某个具体的动作方法中,临时改变布局:

    public function actionView($id)
    {
        $this->layout = 'empty'; // 对应 views/layouts/empty.php,可能是一个没有导航和页脚的简单布局
        return $this->render('view', [
            'model' => $this->findModel($id),
        ]);
    }

通过这些方式,Yii 就能知道在渲染你的视图内容时,应该把它放到哪个布局里。这套机制用起来挺顺手的,尤其是在需要保持页面结构一致性的时候,避免了大量重复的HTML代码。

Yii布局文件通常放在哪里?

Yii 框架对于布局文件的存放位置是有约定俗成的,这极大地帮助了我们组织项目结构。通常情况下,布局文件会被放置在应用程序的

views/layouts/
目录下。比如,如果你有一个名为
basic
的应用程序,那么它的布局文件路径就是
basic/views/layouts/

这个约定并非强制,但强烈推荐遵循。原因很简单:Yii 默认就会去这个位置寻找布局文件。当你配置

layout
main
时,Yii 会自动解析为
@app/views/layouts/main.php
。这种约定减少了配置的复杂性,也让其他开发者更容易理解你的项目结构。

当然,如果你有特殊需求,比如你的项目非常庞大,或者你正在开发一个模块化的应用,你也可以自定义布局文件的存放路径。这可以通过在应用程序配置中设置

layoutPath
属性来实现,或者在模块配置中设置模块的
layoutPath

比如,在一个模块

blog
中,如果你想让它的布局文件放在
modules/blog/views/blog_layouts/
,你可以在
modules/blog/Module.php
中这样配置:

cqcms通用企业建站(PC+wap)2.9
cqcms通用企业建站(PC+wap)2.9

cqcms通用企业建站介绍 苍穹企业网站管理系统(CQCMS)软件是国产PHP网站内容管理系统:CQcms内容管理系统 ,它将成为您轻松建站的利器。模板全部使用文件形式保存,对用户设计模板、网站升级转移均提供很大的便利,健壮的模板标签为站长DIY自己的网站提供了强有力的支持。MVC框架,自定义标签,模板文件修改非常方便,PC+WAP响应式布局,一个域名,自动识别终端,一个后台同时管理PC和wap。

下载
namespace app\modules\blog;

class Module extends \yii\base\Module
{
    public $controllerNamespace = 'app\modules\blog\controllers';

    public function init()
    {
        parent::init();
        // 自定义模块的布局路径
        $this->layoutPath = '@app/modules/blog/views/blog_layouts';
        // 默认使用 'blog_main' 布局
        $this->layout = 'blog_main';
    }
}

这样一来,该模块下的控制器如果没有明确指定布局,就会默认使用

modules/blog/views/blog_layouts/blog_main.php
。这种灵活性使得Yii在应对不同规模和复杂度的项目时都显得游刃有余。对我个人而言,我通常会把全局的放在
views/layouts/
,而针对特定模块或功能有独特布局需求的,则会考虑在模块内部建立自己的
layouts
目录。这让项目结构既清晰又具备扩展性。

如何在Yii控制器中指定或禁用特定布局?

在Yii中,控制布局的粒度可以非常细致,从全局应用到单个控制器,再到具体的动作方法。如果你想让某个控制器下的所有动作都使用一个特定的布局,或者干脆禁用布局,这在控制器类中设置一个属性就能搞定。

在控制器类中,你可以声明一个公共属性

$layout
,并将其值设置为你想要使用的布局文件的名称(不包含
.php
后缀)。Yii 会根据这个名称去
layoutPath
寻找对应的文件。

例如,我们有一个

UserController
,我们希望它下面的所有页面都使用一个名为
user_panel
的布局,而不是全局的
main
布局:

namespace app\controllers;

use yii\web\Controller;

class UserController extends Controller
{
    public $layout = 'user_panel'; // 这会使用 views/layouts/user_panel.php

    public function actionProfile()
    {
        return $this->render('profile');
    }

    public function actionSettings()
    {
        return $this->render('settings');
    }
}

这样,

actionProfile
actionSettings
渲染的视图内容,都会被
user_panel.php
这个布局文件包裹。

那么,如果某个页面我们不希望有任何布局,比如一个Ajax请求返回的纯JSON数据,或者一个需要全屏展示的特殊页面,我们可以直接禁用布局。做法也很简单,将

$layout
属性设置为
false
即可:

namespace app\controllers;

use yii\web\Controller;

class ApiController extends Controller
{
    // 这个控制器下的所有动作默认都没有布局
    public $layout = false;

    public function actionGetData()
    {
        \Yii::$app->response->format = \yii\web\Response::FORMAT_JSON;
        return ['status' => 'success', 'data' => ['item1', 'item2']];
    }
}

或者,你也可以在某个具体的动作方法中临时禁用布局,这会覆盖控制器级别的设置:

namespace app\controllers;

use yii\web\Controller;

class SiteController extends Controller
{
    // ...其他动作和属性

    public function actionPrintablePage()
    {
        // 针对这个动作,禁用布局
        $this->layout = false;
        return $this->render('printable-view');
    }
}

这种灵活的控制方式,让我能够根据不同页面的需求,精准地选择或禁用布局,避免了不必要的HTML结构,也方便了特定功能的实现,比如打印预览页面或者纯API接口。

Yii布局中如何引入CSS和JavaScript资源?

在Yii布局中引入CSS和JavaScript资源,最佳实践是使用Yii的资产包(Asset Bundles)机制。这套系统非常强大,它不仅能帮你管理资源的路径,还能处理依赖关系、版本控制、压缩合并,甚至CDN发布,极大优化了前端性能。

通常,每个Yii应用都会有一个默认的

AppAsset
资产包,它位于
assets/AppAsset.php
。这个文件定义了你的应用全局需要加载的CSS和JS文件。

assets/AppAsset.php
示例:

<?php

namespace app\assets;

use yii\web\AssetBundle;

class AppAsset extends AssetBundle
{
    public $basePath = '@webroot';
    public $baseUrl = '@web';
    public $css = [
        'css/site.css', // 你的自定义CSS文件
        // 也可以是外部链接的CSS
        // 'https://fonts.googleapis.com/css?family=Roboto',
    ];
    public $js = [
        // 'js/main.js', // 你的自定义JS文件
    ];
    public $depends = [
        'yii\web\YiiAsset', // Yii核心JS
        'yii\bootstrap4\BootstrapAsset', // Bootstrap CSS
        'yii\bootstrap4\BootstrapPluginAsset', // Bootstrap JS (需要依赖JQuery)
    ];
}

在你的布局文件(比如

views/layouts/main.php
)中,你只需要注册这个资产包,Yii就会自动帮你把所有相关的CSS和JS文件引入到页面中:

<?php
use app\assets\AppAsset;

AppAsset::register($this); // 注册AppAsset
?>
<!DOCTYPE html>
<html lang="<?= Yii::$app->language ?>" class="h-100">
<head>
    <!-- ... 其他head内容 ... -->
    <?php $this->head() ?> // 必须有这一行,用于输出CSS
</head>
<body>
    <!-- ... 页面内容 ... -->
    <?php $this->endBody() ?> // 必须有这一行,用于输出JS
</body>
</html>

$this->head()
会在
<head>
标签内输出所有注册的CSS文件,而
$this->endBody()
则会在
</body>
标签闭合前输出所有注册的JS文件(这是推荐的做法,因为JS文件通常不应该阻塞页面渲染)。

为什么推荐资产包?

  1. 依赖管理: 你可以声明一个资产包依赖于另一个资产包。比如
    AppAsset
    依赖
    YiiAsset
    BootstrapAsset
    ,Yii 会确保它们的加载顺序正确。
  2. 版本控制: 当你更新CSS或JS文件时,Yii 会自动为它们生成一个带哈希值的URL(在生产模式下),避免浏览器缓存问题。
  3. 合并与压缩: 在生产环境中,Yii可以配置将多个CSS文件合并成一个,多个JS文件合并成一个,并进行压缩,从而减少HTTP请求数量和文件大小,显著提升加载速度。
  4. CDN支持: 资产包可以配置为从CDN加载资源,进一步优化全球访问速度。

当然,如果你只是偶尔需要引入一个非常小的、不依赖任何东西的CSS或JS片段,也可以使用

Html::cssFile()
Html::jsFile()
,甚至直接在布局中写
<style>
<script>
标签。但对于结构化的、可复用的资源,资产包无疑是更优雅和高效的选择。我个人在项目中,几乎所有的前端资源都会通过资产包来管理,这样既保证了代码的整洁,又让前端性能优化变得轻而易举。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
json数据格式
json数据格式

JSON是一种轻量级的数据交换格式。本专题为大家带来json数据格式相关文章,帮助大家解决问题。

450

2023.08.07

json是什么
json是什么

JSON是一种轻量级的数据交换格式,具有简洁、易读、跨平台和语言的特点,JSON数据是通过键值对的方式进行组织,其中键是字符串,值可以是字符串、数值、布尔值、数组、对象或者null,在Web开发、数据交换和配置文件等方面得到广泛应用。本专题为大家提供json相关的文章、下载、课程内容,供大家免费下载体验。

546

2023.08.23

jquery怎么操作json
jquery怎么操作json

操作的方法有:1、“$.parseJSON(jsonString)”2、“$.getJSON(url, data, success)”;3、“$.each(obj, callback)”;4、“$.ajax()”。更多jquery怎么操作json的详细内容,可以访问本专题下面的文章。

326

2023.10.13

go语言处理json数据方法
go语言处理json数据方法

本专题整合了go语言中处理json数据方法,阅读专题下面的文章了解更多详细内容。

81

2025.09.10

ajax教程
ajax教程

php中文网为大家带来ajax教程合集,Ajax是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换,Ajax可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。php中文网还为大家带来ajax的相关下载资源、相关课程以及相关文章等内容,供大家免费下载使用。

166

2023.06.14

ajax中文乱码解决方法
ajax中文乱码解决方法

ajax中文乱码解决方法有设置请求头部的字符编码、在服务器端设置响应头部的字符编码和使用encodeURIComponent对中文进行编码。本专题为大家提供ajax中文乱码相关的文章、下载、课程内容,供大家免费下载体验。

170

2023.08.31

ajax传递中文乱码怎么办
ajax传递中文乱码怎么办

ajax传递中文乱码的解决办法:1、设置统一的编码方式;2、服务器端编码;3、客户端解码;4、设置HTTP响应头;5、使用JSON格式。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

124

2023.11.15

ajax网站有哪些
ajax网站有哪些

使用ajax的网站有谷歌、维基百科、脸书、纽约时报、亚马逊、stackoverflow、twitter、hacker news、shopify和basecamp等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

250

2024.09.24

Golang 测试体系与代码质量保障:工程级可靠性建设
Golang 测试体系与代码质量保障:工程级可靠性建设

Go语言测试体系与代码质量保障聚焦于构建工程级可靠性系统。本专题深入解析Go的测试工具链(如go test)、单元测试、集成测试及端到端测试实践,结合代码覆盖率分析、静态代码扫描(如go vet)和动态分析工具,建立全链路质量监控机制。通过自动化测试框架、持续集成(CI)流水线配置及代码审查规范,实现测试用例管理、缺陷追踪与质量门禁控制,确保代码健壮性与可维护性,为高可靠性工程系统提供质量保障。

6

2026.02.28

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
CSS3 教程
CSS3 教程

共18课时 | 6.3万人学习

Git 教程
Git 教程

共21课时 | 3.9万人学习

Excel 教程
Excel 教程

共162课时 | 19.4万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号