1.前提
下载后台管理系统模板(任一模板即可),地址:http://x.xuebingsi.com/
下载thinkphp框架:地址:http://www.thinkphp.cn/
并安装php集成开发环境phpstudy,编辑器使用phpstorm。
框架结构如下:
project 应用部署目录
├─application 应用目录(可设置)
│ ├─common 公共模块目录(可更改)
│ ├─index 模块目录(可更改)
│ │ ├─config.php 模块配置文件
│ │ ├─common.php 模块函数文件
│ │ ├─controller 控制器目录
│ │ ├─model 模型目录
│ │ ├─view 视图目录
│ │ └─ ... 更多类库目录
│ ├─command.php 命令行工具配置文件
│ ├─common.php 应用公共(函数)文件
│ ├─config.php 应用(公共)配置文件
│ ├─database.php 数据库配置文件
│ ├─tags.php 应用行为扩展定义文件
│ └─route.php 路由配置文件
├─extend 扩展类库目录(可定义)
├─public WEB 部署目录(对外访问目录)
│ ├─static 静态资源存放目录(css,js,image)
│ ├─index.php 默认应用入口文件
│ ├─admin.php 新建应用入口文件
│ ├─router.php 快速测试文件
│ └─.htaccess 用于 apache 的重写
├─runtime 应用的运行时目录(可写,可设置)
├─vendor 第三方类库目录(Composer)
├─thinkphp 框架系统目录
│ ├─lang 语言包目录
│ ├─library 框架核心类库目录
│ │ ├─think Think 类库包目录
│ │ └─traits 系统 Traits 目录
│ ├─tpl 系统模板目录
│ ├─.htaccess 用于 apache 的重写
│ ├─.travis.yml CI 定义文件
│ ├─base.php 基础定义文件
│ ├─composer.json composer 定义文件
│ ├─console.php 控制台入口文件
│ ├─convention.php 惯例配置文件
│ ├─helper.php 助手函数文件(可选)
│ ├─LICENSE.txt 授权说明文件
│ ├─phpunit.xml 单元测试配置文件
│ ├─README.md README 文件
│ └─start.php 框架引导文件
├─build.php 自动生成定义文件(参考)
├─composer.json composer 定义文件
├─LICENSE.txt 授权说明文件
├─README.md README 文件
├─think 命令行入口文件
2.入口文件的创建
利用phpstudy的站点域名管理,将域名或端口与框架的public进行绑定,本次设置的为81端口,可以通过在地址栏键入localhost:81访问。网页显示如下:
我们输入localhost:81默认访问的是public目录下的index.php文件,可以创建一个自己的入口文件,分为三步。
(1)在public目录下新建php文件,命名admin.php,并将index.php的内容拷贝过来。
(2)打开application下的config文件,修改配置项,auto_bind_module为true。
(3)要在application目录下新建一个模块,利用cmd方式新建。cd到project目录下,执行如下命令:
php think build --module admin
如下图代表创建成功,并且你可以查看application目录下会有一个新的admin模块。
当我们在地址栏键入localhost:81/admin/php时,依然会出现如下的页面,代表创建过程一切顺利。
3.模板导入
(1)除了controller.php,我们还需要创建一个公共控制器。在admin下创建common目录,并新建一个php类Base.php,作为一些基础功能类。
刚开始,代码只有这些基础的,它是继承于Controller的。
<?php
namespace app\admin\common;
use think\Controller;
class Base extends Controller
{
}
controller下的index.php基础Base类。
<?php
namespace app\admin\controller;
use app\admin\common\Base;
class Index extends Base
{
public function index()
{
return $this ->view ->fetch('index');//返回view文件夹下index的index.html
}
}
(2)在admin下的view目录新建index文件夹,将X-admin中的index.html文件拷贝过来。
首先我们public下的入口文件admin.php与admin模块绑定(两者必须同名),网页上打开admin.php的时候会运行模块中控制目录下的index.php,它返回的是index.html。我们在网页上输入localhost:81/admin.php,显示如下。
(3)加载css
在public中static目录新建admin文件夹,把css等静态资源复制进来。此时我们的网页仍然无法加载css等文件,因为html中的路径并发生了改变。
我们需要打开thinkphp/library/think/view.php,找到系统定义的五个常量。
$baseReplace = [
'__ROOT__' => $root,
'__URL__' => $base . '/' . $request->module() . '/' . Loader::parseName($request->controller()),
'__STATIC__' => $root . '/static',
'__CSS__' => $root . '/static/css',
'__JS__' => $root . '/static/js',
];
我们可以参照application下的config.php,对admin模块下的config.php进行如下修改,将常量进行重置,并替换到html中。
<?php
//后台配置文件
return [
// 视图输出字符串内容替换
'view_replace_str' => [
// 重置_STATIC_常量,原始的在thinkphp/library/think/view.php下
'__STATIC__'=>'/static/admin',
],
];
紧接着我们只需要在html中ctrl+r,将./替换成__STATIC__/就可以了(其实大家重置也可以,直接将./替换成./static/admin也可以,毕竟只是一个路径)。在网页上输入localhost:81/admin.php,此时已经加载了css等插件。
四、分离模板
一个系统会由很多个页面组成,它们的head部分或者一些其他的内容大径相同。分离模板的主要作用是为了实现代码的复用,减省重复的代码;在修改的同时也更加的方便了。
在view下创建一个public文件夹,在public下新建一个header.html文件,将index.html的前面部分内容拷贝至header.html,然后删除改换成:
{include file='public/header'/}
header.html代码:
index.html代码:
还可以根据需求替换其他的一些内容,替换完之后页面还是会正常加载。
五、其他页面的添加
这时候只有当前一个index.html页面,点击页面中的其他链接无法跳转,需要继续添加其他页面。
(1)创建文件
首先查看自己所需要添加的模板文件,例如我要添加member-list.html,在application/admin/view文件夹下新建文件夹manager,并拷贝html文件到该文件夹下。
(2)生成控制器
我们使用命令行的方式来生成控制器。
首先,cd到project的目录下,输入命令:
php think make:controller admin/Manager
如下显示代表创建成功,并且controller目录下新生成Manager.php文件
(3)渲染页面
打开开Manager.php,改变其继承关系,继承Base。接着,将html文件渲染出来。
$this ->view ->fetch('member_list');
(4)修改Index.html中的url,目的是点击页面的链接,能跳到指定页面下。url中的含义是admin模块下manager控制器的index方法。(本来和教学视频中的打的一样,但是没有效果,自己试了很多方式才生效)
<a href="{:url('admin/manager/index')}">
<i class="iconfont"></i>
会员列表
</a>
此时,页面可以正常跳转。