thinkphp5框架新建页面相关规范详解

本应用基于ThinkPHP的MVC(模型-试图-控制器)的方式来组织。在新建页面时必须遵循该设计模式。

以下以移动端首页为例,新建页面步骤:

移动端首页文件路径:
application->wap->view->first->index->index.html
模板渲染:

application->wap->controller->Index.php->index()
index.html结构:

thinkphp5框架新建页面相关规范详解_第1张图片

JavaScript模块:
页面JavaScript模块化遵循AMD规范,基于RequireJS实践。

新建JavaScript模块文件路径:

public->wap->first->zsff->js
在js文件夹下新建js文件(一个js文件即是一个JavaScript模块)。

模块写法:

thinkphp5框架新建页面相关规范详解_第2张图片

引入模块:

thinkphp5框架新建页面相关规范详解_第3张图片

Vue使用方法:

模块路径定义:

application->wap->view->first->public->requirejs.html

thinkphp5框架新建页面相关规范详解_第4张图片

页面引入Vue:

提示:模块是先定义,再引用,再使用!!!

thinkphp5框架新建页面相关规范详解_第5张图片

Vue组件:基于RequireJS、css.js和text.js配合,实现Vue组件的使用。

在requirejs.html配置css.js和text.js:

thinkphp5框架新建页面相关规范详解_第6张图片

新建Vue组件,组件文件路径:

public->wap->first->zsff->components

在components文件下新建组件,可参考源码中payment组件。

thinkphp5框架新建页面相关规范详解_第7张图片

如果大家还有不懂的可以在下方留言,我们会给你详细的解答

最后
如果你觉得这篇文章对你有点用的话,麻烦请给我们的开源项目点点star:http://github.crmeb.net/u/defu不胜感激 !

免费获取源码地址:http://www.crmeb.com

PHP学习手册:https://doc.crmeb.com

技术交流论坛:https://q.crmeb.com

你可能感兴趣的:(thinkphp5)