thinkphp5实战系列(二)前台模板的引入

我的《thinkphp5实战系列(一)前期配置》文章链接为：点击打开链接

欢迎访问。

1、前台模板的引入

在创建好的index模块下的controller控制器里新建一个Index.php控制器，在里面写上引入模板的代码，

<?php
namespace app\index\controller;use think\Controller;
class Index extends Controller
{
public function index()
{
return $this->fetch('index');
}
}

这样就表示引入一个index.html文件做为前台页面，但现在我们还没有这个文件，所以我们在index模块文件夹下创建一个view文件夹用来存放前台模板，目录结构为app->view->index->index.html.这样子$this->fetch()这个方法就会顺着目录来找到我们的前台模板并输出

2、CSS JS文件的引入

在前台模板成功引入后，我们发现虽然页面成功加载了，但样式并没有加载，网页加载不完全，这时候我们就需要引入网页的样式文件了。

网页样式文件存储在public->static下，我在这个文件夹下面分别创建了index,admin两个文件夹，来分别存放两个模块的样式文件

文件放好后接下来就引入地址的问题了。要怎样才能在html文件中成功引入样式文件呢？

我们可以在app目录下的config.php的‘’模板设置‘’可以配置模板文件的目录，不过为了方便，我将config文件复制一份分别放在了我的两个模块里，模块中的config我只保留模板目录的路径

index模块目录下的config.php

<?php
return[
'view_replace_str'=>[
'__PUBLIC__'=>SITE_URL.'/public/static/index',
]
];

admin模块目录下的config.php

<?php
return[
'view_replace_str'=>[
'__PUBLIC__'=>SITE_URL.'/public/static/admin',
]
];

这个config文件里的配置会覆盖app目录下的配置，所以各模块下的config文件在引用时会生效.这样子我们在访问不同模块的时候，用的就是不同的config配置了。

在HTML中引入方法

<linkhref="__PUBLIC__/css/bootstrap.min.css"rel="stylesheet"type="text/css"/>

相当于是访问了这个路径

<linkhref="public/static/index/css/bootstrap.min.css"rel="stylesheet"type="text/css"/>

这样子就成功的把前台模板引入了，回到网页，刷新，网页样式已经加载出来了

我的《thinkphp5实战系列(一)前期配置》文章链接为：点击打开链接

欢迎访问。

thinkphp5实战系列(二)前台模板的引入相关推荐

【Youtobe trydjango】Django2.2教程和React实战系列二【settings配置文件】
[Youtobe trydjango]Django2.2教程和React实战系列二[settings配置文件] 1. Django项目初始化过程 2. 全貌 3. 详细解释 4. 增加其他配置 1. ...
【Youtobe trydjango】Django2.2教程和React实战系列七【模板templates和Django模板引擎】
[Youtobe trydjango]Django2.2教程和React实战系列七[模板templates和Django模板引擎] 1. 修改视图函数 2. 新建模板文件夹和html文件 3. 项目配 ...
xen虚拟化实战系列(二)之xen虚拟机安装
xen虚拟化实战系列文章列表 xen虚拟化实战系列(一)之xen虚拟化环境安装 xen虚拟化实战系列(二)之xen虚拟机安装 xen虚拟化实战系列(三)之xen虚拟机复制 xen虚拟化实战系列(四)之 ...
MP实战系列(二)之集成swagger
其实与spring+springmvc+mybatis集成swagger没什么区别,只是之前写的太不好了,所以这次决定详细写. 提到swagger不得不提rest,rest是一种架构风格,里面有对不同 ...
ATTCK实战系列(二)
vlunstack是红日安全团队出品的一个实战环境,具体介绍请访问:漏洞详情拓扑结构大体如下: 环境搭建 Kali ip:192.168.111.135 Web Ip1:192.168.111.80 ...
活动目录实战系列二（主域控无法正常启动）
今天一大早过来,发现WIN98客户端无法登陆,一检查主域控DOWN机了,没法启动.幸好做了额外DC,通过抢占PDC角色,提升额外DC为主DC,先使客户机正常登录域环境,这样我们为修复主域控争取时间.环 ...
【CA-TA实战系列二】如何创建一个TA
前言年末假期的最后一天信誓旦旦的说,希望年前把这个系列做完,最后还是只做了第一篇,因为最近告诉自己不能熬夜了.一晃就是年后的假期倒数第二天了.时间真的好快. 今天就到了学校,老实讲虽然家里也吵吵闹闹 ...
云计算实战系列二(Linux-用户管理)
Linux用户管理 1 用户概览 1.1. 用户/组基本概念! ==================================================== Users and group ...
java search 不能使用方法_ElasticSearch实战系列三: ElasticSearch的JAVA API使用教程
前言在上一篇中介绍了ElasticSearch实战系列二: ElasticSearch的DSL语句使用教程---图文详解,本篇文章就来讲解下 ElasticSearch 6.x官方Java API的 ...
【机器学习】实战系列五——天文数据挖掘实验（天池比赛）
系列文章目录学习笔记: [机器学习]第一章--机器学习分类和性能度量 [机器学习]第二章--EM(期望最大化)算法 [机器学习]第六章--概率无向图模型实战系列: [机器学习]实战系列一--波士顿 ...

thinkphp5实战系列(二)前台模板的引入

thinkphp5实战系列(二)前台模板的引入相关推荐

最新文章

热门文章