讲师中心 微信公众号
AI工具推荐 视频效率加速

Yii框架如何集成Layui_Yii框架后台模板融合教程【实战】

云杰君_6094

云杰君_6094

发布时间:2026-04-23 12:41:49

|

373人浏览过

|

来源于php中文网

原创

Yii集成Layui核心卡点在资源加载顺序、表单验证桥接、AJAX数据交互三方面:需通过AssetBundle显式声明JqueryAsset依赖并设JS加载位置为POS_HEAD;ActiveForm须禁用客户端校验,改用layui.form监听submit并手动$.post提交;layui.table需parseData适配Yii返回结构,菜单权限须后端RBAC校验过滤而非仅前端隐藏。

yii框架如何集成layui_yii框架后台模板融合教程【实战】

Yii 集成 Layui 不是“套个 CSS 就完事”,核心卡点在资源加载顺序、表单验证桥接、AJAX 数据交互这三块。直接硬塞 layui.js 会导致 form.render() 失效、lay-submit 不触发、table 渲染空白——因为 Yii 的 ActiveForm 默认会拦截 submit 事件,而 Layui 的表单提交依赖原生 DOM 行为。

yii\web\AssetBundle 必须显式声明 jQuery 和 layui 的依赖顺序

很多人把 jquery.min.jslayui.js 并列写进 $js 数组,结果 layui 启动时报 jQuery is not defined

  • LayuiAsset$depends 必须包含 yii\web\JqueryAsset(不能只靠 yii\web\YiiAsset
  • $jsOptions['position'] 要设为 View::POS_HEADView::POS_BEGIN,否则 layui.css 加载晚于 DOM 渲染,样式错位
  • 若项目已用 yii2-jui 或其他 JS 组件,需确认它们没覆盖全局 $,否则 layui.use(['form'], ...) 会静默失败

正确示例:

class LayuiAsset extends AssetBundle
{
    public $basePath = '@webroot';
    public $baseUrl = '@web';
    public $css = [
        'assets/layuiadmin/layui/css/layui.css',
        'assets/layuiadmin/style/admin.css',
    ];
    public $js = [
        'assets/layuiadmin/layui/layui.js',
    ];
    public $jsOptions = ['position' => \yii\web\View::POS_HEAD];
    public $depends = [
        \yii\web\JqueryAsset::class, // 关键:必须显式依赖
    ];
}

ActiveForm 与 lay-submit 冲突时,禁用 Yii 自动提交并手动接管

当你在 ActiveForm::begin() 里写 lay-submit 按钮,点击后页面刷新或 400 错误,是因为 Yii 的 ActiveForm 默认绑定 submit 事件并执行 AJAX 提交逻辑,而 Layui 的 lay-submit 是纯 DOM 触发,两者互不感知。

  • 解决方法:给 ActiveForm::begin()'enableClientValidation' => false, 'validateOnSubmit' => false,关闭 Yii 前端校验
  • layui.use(['form'], function(){...}) 手动监听 form.on('submit(...)'),再用 $.post() 提交到 Yii 控制器
  • 后端控制器要返回 JSON(不是 render()),例如:return $this->asJson(['code' => 0, 'msg' => 'ok', 'data' => []]);
  • 注意 CSRF:Layui 提交时需带上 X-CSRF-Token 请求头,值取自 meta[name="csrf-token"]content 属性

layui.table 使用 Yii2 分页接口时,urlparseData 必须配对处理

layui.table 默认期望后端返回 {code: 0, count: 100, data: [...]},但 Yii2 的 ActiveDataProvider 或原生 SQL 查询通常返回二维数组,没有 count 字段,直接传会报 count is undefined

Yii Framework 2.0.51
Yii Framework 2.0.51

Yii Framework 2.0.51 官方 Basic 应用模板,适合旧项目兼容、升级验证和开发测试。

下载
  • 前端 table 的 url 应指向一个专用 action(如 /admin/user/list),不要复用 index 视图页
  • 必须配置 parseData 回调,把 Yii 返回的 ['dataList' => [...], 'total' => 123] 映射为 Layui 要的结构
  • 后端 PHP 中避免用 ActiveDataProvider 直接 toArray(),它默认不带总条数;改用原生查询或手动补 totalCount
  • 如果用了 yii2-grid 等扩展,注意它可能劫持响应格式,需在 action 中先 Yii::$app->response->format = Response::FORMAT_JSON;

示例 parseData

parseData: function(res){
    return {
        "code": res.code || 0,
        "msg": res.msg || "",
        "count": res.total || 0,
        "data": res.dataList || []
    };
}

菜单权限控制不能只靠 config/menu.php,必须和 RBAC 规则联动

看到 config/menu.php 里写了 ['url' => '/admin/user'],就以为用户有权限访问?错。Yii 的 UrlRule 只负责路由匹配,不校验权限。Layui 左侧菜单渲染出来,但点击 403,说明权限没透传到前端渲染逻辑。

  • config/menu.php 中的 url 必须是 RBAC 中已定义的权限项(即 authManager->addPermission() 创建过的)
  • 菜单生成前,应调用 Yii::$app->user->can($permissionName) 过滤掉无权项,而不是全量渲染再前端 hide
  • 常见坑:菜单项 URL 写成 ['/admin/user/index'],但 RBAC 中注册的是 admin/user(省略 action),导致 can() 返回 false
  • 建议封装一个 MenuHelper::getAccessibleMenu(),内部遍历 menu 配置并逐条 can() 校验,再递归过滤子项

最易忽略的一点:layuiadmin 的侧边栏是前端渲染的,如果后端没做过滤,菜单项即使不可点,URL 仍可被手动输入访问——权限控制必须双端一致,后端鉴权不可绕过。

热门AI工具

更多
LibLibAI
LibLibAI Hot

一款AI视频创作工具,主要用于国内领先的AI创意平台,以海量模型、低门槛操作与“创作-分享-商业化”生态,让小白与专业创作者都能高效实现图文乃至视频创意表达,适合需要提升相关任务效率的用户。

超级简历WonderCV

一款AI办公效率工具,主要用于免费求职简历模版下载制作,应届生职场人必备简历制作神器,适合需要提升相关任务效率的用户。

Seko
Seko Hot

一款AI视频创作工具,主要用于商汤科技推出的创编一体的AI短视频创作Agent,适合需要提升相关任务效率的用户。

豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

火山引擎

火山引擎是一款面向企业的云计算与AI服务平台。

AionClaw
AionClaw Hot

AionClaw是一款面向办公、创作和编程任务的AI桌面智能体。

WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

切问学术

切问学术是一款AI论文写作工具,复旦大学NLP团队推出的AI学术智能体。

相关专题

更多
php文件怎么打开
php文件怎么打开

打开php文件步骤:1、选择文本编辑器;2、在选择的文本编辑器中,创建一个新的文件,并将其保存为.php文件;3、在创建的PHP文件中,编写PHP代码;4、要在本地计算机上运行PHP文件,需要设置一个服务器环境;5、安装服务器环境后,需要将PHP文件放入服务器目录中;6、一旦将PHP文件放入服务器目录中,就可以通过浏览器来运行它。

9104

2023.09.01

php怎么取出数组的前几个元素
php怎么取出数组的前几个元素

取出php数组的前几个元素的方法有使用array_slice()函数、使用array_splice()函数、使用循环遍历、使用array_slice()函数和array_values()函数等。本专题为大家提供php数组相关的文章、下载、课程内容,供大家免费下载体验。

5521

2023.10.11

php反序列化失败怎么办
php反序列化失败怎么办

php反序列化失败的解决办法检查序列化数据。检查类定义、检查错误日志、更新PHP版本和应用安全措施等。本专题为大家提供php反序列化相关的文章、下载、课程内容,供大家免费下载体验。

2015

2023.10.11

php怎么连接mssql数据库
php怎么连接mssql数据库

连接方法:1、通过mssql_系列函数;2、通过sqlsrv_系列函数;3、通过odbc方式连接;4、通过PDO方式;5、通过COM方式连接。想了解php怎么连接mssql数据库的详细内容,可以访问下面的文章。

3428

2023.10.23

php连接mssql数据库的方法
php连接mssql数据库的方法

php连接mssql数据库的方法有使用PHP的MSSQL扩展、使用PDO等。想了解更多php连接mssql数据库相关内容,可以阅读本专题下面的文章。

4094

2023.10.23

html怎么上传
html怎么上传

html通过使用HTML表单、JavaScript和PHP上传。更多关于html的问题详细请看本专题下面的文章。php中文网欢迎大家前来学习。

3211

2023.11.03

PHP出现乱码怎么解决
PHP出现乱码怎么解决

PHP出现乱码可以通过修改PHP文件头部的字符编码设置、检查PHP文件的编码格式、检查数据库连接设置和检查HTML页面的字符编码设置来解决。更多关于php乱码的问题详情请看本专题下面的文章。php中文网欢迎大家前来学习。

4557

2023.11.09

php文件怎么在手机上打开
php文件怎么在手机上打开

php文件在手机上打开需要在手机上搭建一个能够运行php的服务器环境,并将php文件上传到服务器上。再在手机上的浏览器中输入服务器的IP地址或域名,加上php文件的路径,即可打开php文件并查看其内容。更多关于php相关问题,详情请看本专题下面的文章。php中文网欢迎大家前来学习。

3562

2023.11.13

Buffalo框架数据库开发全教程
Buffalo框架数据库开发全教程

本专题围绕Buffalo框架数据库开发,讲解database.yml多环境配置、soda与fizz迁移生成回滚、模型结构体标签、增删改查与条件查询、一对多与多对多关联、数据校验、回调钩子、事务处理及原生SQL执行能力。

0

2026.09.23

热门下载

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

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Yii Framework 2.0 API 官方文档
Yii Framework 2.0 API 官方文档

共0课时 | 0人学习

Yii2.0框架开发实战视频教程
Yii2.0框架开发实战视频教程

共22课时 | 9.2万人学习

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

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn