<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>TP3.2 &#8211; 个人随笔</title>
	<atom:link href="/classify/%E5%90%8E%E5%8F%B0%E6%A1%86%E6%9E%B6/tp3-2/feed" rel="self" type="application/rss+xml" />
	<link>/</link>
	<description></description>
	<lastBuildDate>Sat, 09 Jun 2018 01:14:00 +0000</lastBuildDate>
	<language>zh-CN</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.6.1</generator>

<image>
	<url>/wp-content/uploads/2022/01/cropped-截屏2022-01-01-18.57.09-32x32.png</url>
	<title>TP3.2 &#8211; 个人随笔</title>
	<link>/</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>TP 3.2 （一）配置、路由、模型、视图、控制器、商城后台首页展示</title>
		<link>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4022.html</link>
					<comments>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4022.html#respond</comments>
		
		<dc:creator><![CDATA[Mr.Lee]]></dc:creator>
		<pubDate>Sat, 19 May 2018 13:08:24 +0000</pubDate>
				<category><![CDATA[TP3.2]]></category>
		<category><![CDATA[后台框架]]></category>
		<category><![CDATA[商城后台首页展示]]></category>
		<category><![CDATA[控制器]]></category>
		<category><![CDATA[模型]]></category>
		<category><![CDATA[视图]]></category>
		<category><![CDATA[路由]]></category>
		<category><![CDATA[配置]]></category>
		<guid isPermaLink="false">/?p=4022</guid>

					<description><![CDATA[框架概述 1.1、回顾MVC(重点理解) MVC是一个编程思想。将业务拆分成为三个板块分别为模型、视图以及控制 [&#8230;]]]></description>
										<content:encoded><![CDATA[<h1>框架概述</h1>
<h2>1.1、回顾MVC(重点理解)</h2>
<p>
  MVC是一个编程思想。将业务拆分成为三个板块分别为模型、视图以及控制器
</p>
<p>
  M代表是的模型主要是进行数据交互
</p>
<p>
  V代表的就是视图主要是与用户进行交互
</p>
<p>
  C代表是控制器作用作用是进行中间的协同工作。调度模型或者视图完成工作
</p>
<p><img fetchpriority="high" decoding="async" width="1159" height="486" src="/wp-content/uploads/2018/05/word-image-3566.png" class="wp-image-4023" srcset="/wp-content/uploads/2018/05/word-image-3566.png 1159w, /wp-content/uploads/2018/05/word-image-3566-300x126.png 300w, /wp-content/uploads/2018/05/word-image-3566-768x322.png 768w, /wp-content/uploads/2018/05/word-image-3566-1024x429.png 1024w" sizes="(max-width: 1159px) 100vw, 1159px" /></p>
<h2>1.2、什么是框架</h2>
<p>
  框架就是一个半成品的代码库。包括很多的基础功能，能够方便进行项目的开发。使用框架进行项目开发可以节省开发时间。
</p>
<p>
  例如：在前端页面上进行dom操作。可以使用原生的js进行。也可以使用jQuery来进行dom操作。此处jQuery就是前端的一款框架
</p>
<h2>1.3、PHP的常用框架</h2>
<ol>
<li>
  zendframework：由zend公司开发的一款重量级的框架
</li>
<li>
  YII：基于组件的一款框架
</li>
<li>
  CI框架：一款比较轻量的框架
</li>
<li>
  laravel框架：最优雅的框架
</li>
</ol>
<p>
  5、thinkPHP框架：国产框架
</p>
<h2>1.4、TP框架的优点</h2>
<p>
  国产思想符合国人、代码注释都是中文。并且使用量比较大。社区活跃(问题能够及时解决)
</p>
<h1>TP框架的基本使用</h1>
<h2>2.1、TP源码下载</h2>
<p>
  官方网址：<a href="/goto/hl2v" rel="nofollow">http://www.thinkphp.cn/</a>
</p>
<h3>2.1.1、关于版本的选择</h3>
<p>
  3.2版本：主要是针对于web项目(有前台后台)
</p>
<p>
  5.0版本：主要针对api接口项目(全部都是写接口)
</p>
<p>
  关于实际在开发项目中版本的选择没有严格的界限。例如web项目也可以使用5.0版本。写接口也可以使用3.2版本
</p>
<h3>2.1.2、下载TP3.2版本源代码</h3>
<p><img decoding="async" width="1117" height="405" src="/wp-content/uploads/2018/05/word-image-3567.png" class="wp-image-4024" srcset="/wp-content/uploads/2018/05/word-image-3567.png 1117w, /wp-content/uploads/2018/05/word-image-3567-300x109.png 300w, /wp-content/uploads/2018/05/word-image-3567-768x278.png 768w, /wp-content/uploads/2018/05/word-image-3567-1024x371.png 1024w" sizes="(max-width: 1117px) 100vw, 1117px" /></p>
<p>
  关于核心版本与完整版的区别。对于核心版本只包括了框架的基本功能。对于完整版本除了框架基本内容之外还包括其他的功能。例如分页、文件上传等
</p>
<h2>2.2、TP框架项目部署(实现)</h2>
<h3>2.2.1、解析下载的源代码目录文件</h3>
<p>
  ①解析下载的源码
</p>
<p><img decoding="async" width="769" height="274" src="/wp-content/uploads/2018/05/word-image-3568.png" class="wp-image-4025" srcset="/wp-content/uploads/2018/05/word-image-3568.png 769w, /wp-content/uploads/2018/05/word-image-3568-300x107.png 300w, /wp-content/uploads/2018/05/word-image-3568-768x274.png 768w" sizes="(max-width: 769px) 100vw, 769px" /></p>
<p>
  Application:TP默认的应用代码存储的目录(存储自己编写的代码)
</p>
<p>
  Public：TP推荐的存储资源文件的目录
</p>
<p>
  ThinkPHP:TP框架的源代码目录
</p>
<p>
  .htaccess:Apache的重写规则文件
</p>
<p>
  composer.json：composer的配置文件。composer是PHP的代码管理工具
</p>
<p>
  Index.php：项目的入口文件(非常重要)
</p>
<p>
  ②TP框架的源码目录
</p>
<p><img loading="lazy" decoding="async" width="939" height="382" src="/wp-content/uploads/2018/05/word-image-3569.png" class="wp-image-4026" srcset="/wp-content/uploads/2018/05/word-image-3569.png 939w, /wp-content/uploads/2018/05/word-image-3569-300x122.png 300w, /wp-content/uploads/2018/05/word-image-3569-768x312.png 768w" sizes="(max-width: 939px) 100vw, 939px" /></p>
<p>
  Common：存储TP所提供的公共函数文件。对于此目录下的functions.php中的函数可以在任何位置直接使用
</p>
<p>
  Conf:TP的默认配置信息目录
</p>
<p>
  Lang:TP的语言包
</p>
<p>
  Library：TP框架的核心的类库目录
</p>
<p>
  Mode：TP所支持的模式
</p>
<p>
  Tpl：TP默认的系统模板目录
</p>
<p>
  ThinkPHP.php:tp框架的入口文件(在项目的入口文件中必须要载入此文件来载入整个TP框架)
</p>
<h3>2.2.2、创建项目</h3>
<p>
  ①创建项目目录
</p>
<p><img loading="lazy" decoding="async" width="643" height="100" src="/wp-content/uploads/2018/05/word-image-3570.png" class="wp-image-4027" srcset="/wp-content/uploads/2018/05/word-image-3570.png 643w, /wp-content/uploads/2018/05/word-image-3570-300x47.png 300w" sizes="(max-width: 643px) 100vw, 643px" /></p>
<p>
  ②拷贝TP的框架源代码
</p>
<p><img loading="lazy" decoding="async" width="1232" height="332" src="/wp-content/uploads/2018/05/word-image-3571.png" class="wp-image-4028" srcset="/wp-content/uploads/2018/05/word-image-3571.png 1232w, /wp-content/uploads/2018/05/word-image-3571-300x81.png 300w, /wp-content/uploads/2018/05/word-image-3571-768x207.png 768w, /wp-content/uploads/2018/05/word-image-3571-1024x276.png 1024w" sizes="(max-width: 1232px) 100vw, 1232px" /></p>
<h3>2.2.3、创建虚拟主机</h3>
<p>
  ①修改Apache的虚拟主机配置文件
</p>
<p><img loading="lazy" decoding="async" width="934" height="516" src="/wp-content/uploads/2018/05/word-image-3572.png" class="wp-image-4029" srcset="/wp-content/uploads/2018/05/word-image-3572.png 934w, /wp-content/uploads/2018/05/word-image-3572-300x166.png 300w, /wp-content/uploads/2018/05/word-image-3572-768x424.png 768w" sizes="(max-width: 934px) 100vw, 934px" /></p>
<p>
  ②修改本机的hosts文件
</p>
<p><img loading="lazy" decoding="async" width="800" height="444" src="/wp-content/uploads/2018/05/word-image-3573.png" class="wp-image-4030" srcset="/wp-content/uploads/2018/05/word-image-3573.png 800w, /wp-content/uploads/2018/05/word-image-3573-300x167.png 300w, /wp-content/uploads/2018/05/word-image-3573-768x426.png 768w" sizes="(max-width: 800px) 100vw, 800px" /></p>
<p>
  ③重启Apache访问测试
</p>
<p><img loading="lazy" decoding="async" width="881" height="297" src="/wp-content/uploads/2018/05/word-image-3574.png" class="wp-image-4031" srcset="/wp-content/uploads/2018/05/word-image-3574.png 881w, /wp-content/uploads/2018/05/word-image-3574-300x101.png 300w, /wp-content/uploads/2018/05/word-image-3574-768x259.png 768w" sizes="(max-width: 881px) 100vw, 881px" /></p>
<h3>2.2.4、创建应用</h3>
<p>
  ①编写入口文件
</p>
<p><img loading="lazy" decoding="async" width="1188" height="451" src="/wp-content/uploads/2018/05/word-image-3575.png" class="wp-image-4032" srcset="/wp-content/uploads/2018/05/word-image-3575.png 1188w, /wp-content/uploads/2018/05/word-image-3575-300x114.png 300w, /wp-content/uploads/2018/05/word-image-3575-768x292.png 768w, /wp-content/uploads/2018/05/word-image-3575-1024x389.png 1024w" sizes="(max-width: 1188px) 100vw, 1188px" /></p>
<p>
  ②访问测试
</p>
<p><img loading="lazy" decoding="async" width="998" height="465" src="/wp-content/uploads/2018/05/word-image-3576.png" class="wp-image-4033" srcset="/wp-content/uploads/2018/05/word-image-3576.png 998w, /wp-content/uploads/2018/05/word-image-3576-300x140.png 300w, /wp-content/uploads/2018/05/word-image-3576-768x358.png 768w" sizes="(max-width: 998px) 100vw, 998px" /></p>
<p>
  ③查看效果
</p>
<p><img loading="lazy" decoding="async" width="336" height="365" src="/wp-content/uploads/2018/05/word-image-3577.png" class="wp-image-4034" srcset="/wp-content/uploads/2018/05/word-image-3577.png 336w, /wp-content/uploads/2018/05/word-image-3577-276x300.png 276w" sizes="(max-width: 336px) 100vw, 336px" /></p>
<p>
  ④解释应用中的目录
</p>
<p><img loading="lazy" decoding="async" width="1057" height="362" src="/wp-content/uploads/2018/05/word-image-3578.png" class="wp-image-4035" srcset="/wp-content/uploads/2018/05/word-image-3578.png 1057w, /wp-content/uploads/2018/05/word-image-3578-300x103.png 300w, /wp-content/uploads/2018/05/word-image-3578-768x263.png 768w, /wp-content/uploads/2018/05/word-image-3578-1024x351.png 1024w" sizes="(max-width: 1057px) 100vw, 1057px" /></p>
<p>
  ⑤进入Home解释目录<br />
  
</p>
<p><img loading="lazy" decoding="async" width="883" height="299" src="/wp-content/uploads/2018/05/word-image-3579.png" class="wp-image-4036" srcset="/wp-content/uploads/2018/05/word-image-3579.png 883w, /wp-content/uploads/2018/05/word-image-3579-300x102.png 300w, /wp-content/uploads/2018/05/word-image-3579-768x260.png 768w" sizes="(max-width: 883px) 100vw, 883px" /></p>
<p>
  优化小技巧：
</p>
<ol>
<li>
  解决自己项目中的死链接。如果死链接比较多。会影响到项目的加载速度
</li>
</ol>
<p>
  2、更换磁盘为固态
</p>
<ol>
<li>
  磁盘冗余阵列。买raid卡挂载多块磁盘
</li>
</ol>
<h1>控制器及URL模式</h1>
<h2>3.1、创建控制器</h2>
<h3>3.1.1、控制器的存储方式</h3>
<ol>
<li>
  存储地址
</li>
</ol>
<p>
  应用(application)/模块(Home)/Controller
</p>
<ol>
<li>
  文件命名
</li>
</ol>
<p>
  控制器名称(满足驼峰式规范)+Controller+.class.php
</p>
<h3>3.1.2、控制器的创建规则</h3>
<ol>
<li>
  申明命名空间(按照目录地址规则)
</li>
<li>
  引入TP的控制器的基类
</li>
<li>
  编写自定义的控制器的类
</li>
</ol>
<h3>3.1.3、具体创建控制器</h3>
<p><img loading="lazy" decoding="async" width="1248" height="696" src="/wp-content/uploads/2018/05/word-image-3580.png" class="wp-image-4037" srcset="/wp-content/uploads/2018/05/word-image-3580.png 1248w, /wp-content/uploads/2018/05/word-image-3580-300x167.png 300w, /wp-content/uploads/2018/05/word-image-3580-768x428.png 768w, /wp-content/uploads/2018/05/word-image-3580-1024x571.png 1024w" sizes="(max-width: 1248px) 100vw, 1248px" /></p>
<h2>3.2、URL地址解析</h2>
<p>
  默认情况下TP访问的完整地址：<a href="/goto/hd8t" rel="nofollow">http://域名/入口文件?m=模块名称&amp;c=控制器名称&amp;a=方法名称(操作)</a>
</p>
<p>
  ①在控制器中增加方法
</p>
<p><img loading="lazy" decoding="async" width="1163" height="563" src="/wp-content/uploads/2018/05/word-image-3581.png" class="wp-image-4038" srcset="/wp-content/uploads/2018/05/word-image-3581.png 1163w, /wp-content/uploads/2018/05/word-image-3581-300x145.png 300w, /wp-content/uploads/2018/05/word-image-3581-768x372.png 768w, /wp-content/uploads/2018/05/word-image-3581-1024x496.png 1024w" sizes="(max-width: 1163px) 100vw, 1163px" /></p>
<p>
  ②访问测试
</p>
<p><img loading="lazy" decoding="async" width="862" height="277" src="/wp-content/uploads/2018/05/word-image-3582.png" class="wp-image-4039" srcset="/wp-content/uploads/2018/05/word-image-3582.png 862w, /wp-content/uploads/2018/05/word-image-3582-300x96.png 300w, /wp-content/uploads/2018/05/word-image-3582-768x247.png 768w" sizes="(max-width: 862px) 100vw, 862px" /></p>
<h2>3.3、默认访问(理解)</h2>
<h3>3.3.1、分析默认访问的情况</h3>
<p><img loading="lazy" decoding="async" width="1011" height="481" src="/wp-content/uploads/2018/05/word-image-3583.png" class="wp-image-4040" srcset="/wp-content/uploads/2018/05/word-image-3583.png 1011w, /wp-content/uploads/2018/05/word-image-3583-300x143.png 300w, /wp-content/uploads/2018/05/word-image-3583-768x365.png 768w" sizes="(max-width: 1011px) 100vw, 1011px" /></p>
<p>
  对于上述直接访问首先Apache的默认访问页为index.php因此就进入到项目的入口文件。由于TP默认的配置项设置默认的模块为Home默认的控制器为Index默认的方法为index因此可以看到上述效果
</p>
<h3>3.3.2、修改默认访问</h3>
<p>
  ①查看TP中的默认配置项
</p>
<p><img loading="lazy" decoding="async" width="1018" height="410" src="/wp-content/uploads/2018/05/word-image-3584.png" class="wp-image-4041" srcset="/wp-content/uploads/2018/05/word-image-3584.png 1018w, /wp-content/uploads/2018/05/word-image-3584-300x121.png 300w, /wp-content/uploads/2018/05/word-image-3584-768x309.png 768w" sizes="(max-width: 1018px) 100vw, 1018px" /></p>
<p>
  ②修改配置项
</p>
<p><img loading="lazy" decoding="async" width="1024" height="385" src="/wp-content/uploads/2018/05/word-image-3585.png" class="wp-image-4042" srcset="/wp-content/uploads/2018/05/word-image-3585.png 1024w, /wp-content/uploads/2018/05/word-image-3585-300x113.png 300w, /wp-content/uploads/2018/05/word-image-3585-768x289.png 768w" sizes="(max-width: 1024px) 100vw, 1024px" /></p>
<p>
  ③删除缓存文件
</p>
<p><img loading="lazy" decoding="async" width="843" height="267" src="/wp-content/uploads/2018/05/word-image-3586.png" class="wp-image-4043" srcset="/wp-content/uploads/2018/05/word-image-3586.png 843w, /wp-content/uploads/2018/05/word-image-3586-300x95.png 300w, /wp-content/uploads/2018/05/word-image-3586-768x243.png 768w" sizes="(max-width: 843px) 100vw, 843px" /></p>
<p>
  ④查看效果如下
</p>
<p><img loading="lazy" decoding="async" width="866" height="349" src="/wp-content/uploads/2018/05/word-image-3587.png" class="wp-image-4044" srcset="/wp-content/uploads/2018/05/word-image-3587.png 866w, /wp-content/uploads/2018/05/word-image-3587-300x121.png 300w, /wp-content/uploads/2018/05/word-image-3587-768x310.png 768w" sizes="(max-width: 866px) 100vw, 866px" /></p>
<p>
  此时产生报错的原因是因为默认的方法不存在
</p>
<h2>3.4、调试模式</h2>
<p>
  通过定义一个常量操作TP所处的模式。调试默认每次都会自动的加载最新的配置文件以及公共函数。跟调试模式对应的叫做生产模式
</p>
<p>
  在实际开发的过程中开启调试模式。当项目上线运行的过程中需要使用生产模式。在生成模式下会缓存(临时存储信息)对于的文件信息也会减少日志文件的生成
</p>
<p>
  ①开启调试模式
</p>
<p><img loading="lazy" decoding="async" width="976" height="522" src="/wp-content/uploads/2018/05/word-image-3588.png" class="wp-image-4045" srcset="/wp-content/uploads/2018/05/word-image-3588.png 976w, /wp-content/uploads/2018/05/word-image-3588-300x160.png 300w, /wp-content/uploads/2018/05/word-image-3588-768x411.png 768w" sizes="(max-width: 976px) 100vw, 976px" /></p>
<p>
  ②查看访问效果
</p>
<p><img loading="lazy" decoding="async" width="1277" height="567" src="/wp-content/uploads/2018/05/word-image-3589.png" class="wp-image-4046" srcset="/wp-content/uploads/2018/05/word-image-3589.png 1277w, /wp-content/uploads/2018/05/word-image-3589-300x133.png 300w, /wp-content/uploads/2018/05/word-image-3589-768x341.png 768w, /wp-content/uploads/2018/05/word-image-3589-1024x455.png 1024w" sizes="(max-width: 1277px) 100vw, 1277px" /></p>
<p>
  ③查看runtime下的目录
</p>
<p><img loading="lazy" decoding="async" width="896" height="364" src="/wp-content/uploads/2018/05/word-image-3590.png" class="wp-image-4047" srcset="/wp-content/uploads/2018/05/word-image-3590.png 896w, /wp-content/uploads/2018/05/word-image-3590-300x122.png 300w, /wp-content/uploads/2018/05/word-image-3590-768x312.png 768w" sizes="(max-width: 896px) 100vw, 896px" /></p>
<h2>3.5、TP中的模块</h2>
<p>
  在TP中的应用目录下每一个文件就是一个模块只是Common跟Runtime比较特殊。不能参与项目中其他”访问功能业务”。想要增加模块可以直接在应用目录下去增加目录即可
</p>
<p>
  例如如下增加后台模块
</p>
<p>
  ①创建目录
</p>
<p><img loading="lazy" decoding="async" width="912" height="241" src="/wp-content/uploads/2018/05/word-image-3591.png" class="wp-image-4048" srcset="/wp-content/uploads/2018/05/word-image-3591.png 912w, /wp-content/uploads/2018/05/word-image-3591-300x79.png 300w, /wp-content/uploads/2018/05/word-image-3591-768x203.png 768w" sizes="(max-width: 912px) 100vw, 912px" /></p>
<p>
  ②创建控制器
</p>
<p><img loading="lazy" decoding="async" width="1022" height="659" src="/wp-content/uploads/2018/05/word-image-3592.png" class="wp-image-4049" srcset="/wp-content/uploads/2018/05/word-image-3592.png 1022w, /wp-content/uploads/2018/05/word-image-3592-300x193.png 300w, /wp-content/uploads/2018/05/word-image-3592-768x495.png 768w" sizes="(max-width: 1022px) 100vw, 1022px" /></p>
<p>
  ③访问测试
</p>
<p><img loading="lazy" decoding="async" width="682" height="226" src="/wp-content/uploads/2018/05/word-image-3593.png" class="wp-image-4050" srcset="/wp-content/uploads/2018/05/word-image-3593.png 682w, /wp-content/uploads/2018/05/word-image-3593-300x99.png 300w" sizes="(max-width: 682px) 100vw, 682px" /></p>
<h2>3.6、TP中的配置文件</h2>
<h3>3.6.1、配置文件地址</h3>
<ol>
<li>
  Tp框架中惯例配置文件(ThinkPHP\Conf\convention.php)
</li>
<li>
  公共模块的配置文件(Application\Common\Conf\config.php)
</li>
<li>
  某一个模块的配置文件(Application\模块\Conf\config.php)
</li>
</ol>
<p>
  对于配置文件TP是自动载入的。因此可以在项目中直接使用配置文件
</p>
<h3>3.6.2、TP中配置文件的优先级</h3>
<p>
  配置文件优先级含义：当同一个配置项在三个文件中同时出现最终使用哪一个配置文件中的内容
</p>
<p>
  模块配置文件&gt;公共模块配置文件&gt;TP惯例配置文件
</p>
<h3>3.6.3、演示配置文件优先级</h3>
<p>
  ①修改公共模块的配置文件
</p>
<p><img loading="lazy" decoding="async" width="1279" height="336" src="/wp-content/uploads/2018/05/word-image-3594.png" class="wp-image-4051" srcset="/wp-content/uploads/2018/05/word-image-3594.png 1279w, /wp-content/uploads/2018/05/word-image-3594-300x79.png 300w, /wp-content/uploads/2018/05/word-image-3594-768x202.png 768w, /wp-content/uploads/2018/05/word-image-3594-1024x269.png 1024w" sizes="(max-width: 1279px) 100vw, 1279px" /></p>
<p>
  ②修改Home模块下的配置
</p>
<p><img loading="lazy" decoding="async" width="970" height="343" src="/wp-content/uploads/2018/05/word-image-3595.png" class="wp-image-4052" srcset="/wp-content/uploads/2018/05/word-image-3595.png 970w, /wp-content/uploads/2018/05/word-image-3595-300x106.png 300w, /wp-content/uploads/2018/05/word-image-3595-768x272.png 768w" sizes="(max-width: 970px) 100vw, 970px" /></p>
<p>
  ③增加测试方法
</p>
<p><img loading="lazy" decoding="async" width="913" height="452" src="/wp-content/uploads/2018/05/word-image-3596.png" class="wp-image-4053" srcset="/wp-content/uploads/2018/05/word-image-3596.png 913w, /wp-content/uploads/2018/05/word-image-3596-300x149.png 300w, /wp-content/uploads/2018/05/word-image-3596-768x380.png 768w" sizes="(max-width: 913px) 100vw, 913px" /></p>
<p>
  ④查看效果
</p>
<p><img loading="lazy" decoding="async" width="565" height="251" src="/wp-content/uploads/2018/05/word-image-3597.png" class="wp-image-4054" srcset="/wp-content/uploads/2018/05/word-image-3597.png 565w, /wp-content/uploads/2018/05/word-image-3597-300x133.png 300w" sizes="(max-width: 565px) 100vw, 565px" /></p>
<h2>3.7、TP中的四种URL模式（重点）</h2>
<h3>3.7.1、四种URL模式介绍</h3>
<p>
  ①普通模式
</p>
<p>
  直接通过给入口文件传递m、c、a三个参数
</p>
<p>
  m对应模块名称
</p>
<p>
  c对应控制器名称
</p>
<p>
  a对应方法名称
</p>
<p>
  格式：<a href="/goto/zx7y" rel="nofollow">http://tp.com/index.php?m=Home&amp;c=Index&amp;a=test2</a>
</p>
<p>
  任何情况下都可以访问
</p>
<p>
  ②pathinfo模式
</p>
<p>
  Pathinfo模式从URL地址栏上看上去像一个目录的格式。
</p>
<p>
  格式为：<a href="/goto/itit" rel="nofollow">http://tp.com/index.php/Home/Index/test2</a>
</p>
<p>
  对于上述的地址格式入口文件后的每一个“/”分隔的就是一个参数
</p>
<p>
  Home(第一个参数)对应的模块名称
</p>
<p>
  Index(第二个参数)对应的控制器名称
</p>
<p>
  Test2(第三个参数)对应的方法名称
</p>
<p>
  注意：pathinfo模式需要有web服务器的支持 Apache支持此模式。Nginx就不支持
</p>
<p>
  ③重写模式
</p>
<p>
  将原本的URL访问改写成其他的URL形式。重写模式根据不同的web服务器决定。最常见的重写就是隐藏项目的入口文件
</p>
<p>
  例如
</p>
<p>
  访问:http://tp.com/Home/Index/test2=&gt;解析的地址为http://tp.com、index.php/Home/Index/test2
</p>
<p>
  ④兼容模式
</p>
<p>
  考虑部分web服务器不支持pathinfo。又想要去使用类似pathinfo的格式。就可以使用兼容模式
</p>
<p>
  格式：<a href="/goto/dc8y" rel="nofollow">http://tp.com/index.php?s=/Home/Index/test2</a>
</p>
<p>
  兼容模式没有任何其他的外界要求
</p>
<h3>3.7.2、实现隐藏入口文件</h3>
<p>
  ①开启Apache的重写模块
</p>
<p><img loading="lazy" decoding="async" width="1012" height="473" src="/wp-content/uploads/2018/05/word-image-3598.png" class="wp-image-4055" srcset="/wp-content/uploads/2018/05/word-image-3598.png 1012w, /wp-content/uploads/2018/05/word-image-3598-300x140.png 300w, /wp-content/uploads/2018/05/word-image-3598-768x359.png 768w" sizes="(max-width: 1012px) 100vw, 1012px" /></p>
<p>
  ②设置虚拟主机可以重写
</p>
<p><img loading="lazy" decoding="async" width="1126" height="545" src="/wp-content/uploads/2018/05/word-image-3599.png" class="wp-image-4056" srcset="/wp-content/uploads/2018/05/word-image-3599.png 1126w, /wp-content/uploads/2018/05/word-image-3599-300x145.png 300w, /wp-content/uploads/2018/05/word-image-3599-768x372.png 768w, /wp-content/uploads/2018/05/word-image-3599-1024x496.png 1024w" sizes="(max-width: 1126px) 100vw, 1126px" /></p>
<p>
  ③拷贝重写规则文件
</p>
<p><img loading="lazy" decoding="async" width="1172" height="491" src="/wp-content/uploads/2018/05/word-image-3600.png" class="wp-image-4057" srcset="/wp-content/uploads/2018/05/word-image-3600.png 1172w, /wp-content/uploads/2018/05/word-image-3600-300x126.png 300w, /wp-content/uploads/2018/05/word-image-3600-768x322.png 768w, /wp-content/uploads/2018/05/word-image-3600-1024x429.png 1024w" sizes="(max-width: 1172px) 100vw, 1172px" /></p>
<p>
  ④重启Apache查看效果
</p>
<p><img loading="lazy" decoding="async" width="544" height="125" src="/wp-content/uploads/2018/05/word-image-3601.png" class="wp-image-4058" srcset="/wp-content/uploads/2018/05/word-image-3601.png 544w, /wp-content/uploads/2018/05/word-image-3601-300x69.png 300w" sizes="(max-width: 544px) 100vw, 544px" /></p>
<p>
  注意：只要条件满足TP中的四种URL模式都可以使用访问到方法
</p>
<h3>3.7.3、URL地址生成(重点会用)</h3>
<p>
  使用TP提供的U函数根据当前的模型、控制器、方法、参数等生产一个链接地址
</p>
<p>
  ①查看U函数的使用方式
</p>
<p><img loading="lazy" decoding="async" width="1157" height="639" src="/wp-content/uploads/2018/05/word-image-3602.png" class="wp-image-4059" srcset="/wp-content/uploads/2018/05/word-image-3602.png 1157w, /wp-content/uploads/2018/05/word-image-3602-300x166.png 300w, /wp-content/uploads/2018/05/word-image-3602-768x424.png 768w, /wp-content/uploads/2018/05/word-image-3602-1024x566.png 1024w" sizes="(max-width: 1157px) 100vw, 1157px" /></p>
<p>
  ②编写测试代码
</p>
<p><img loading="lazy" decoding="async" width="1097" height="695" src="/wp-content/uploads/2018/05/word-image-3603.png" class="wp-image-4060" srcset="/wp-content/uploads/2018/05/word-image-3603.png 1097w, /wp-content/uploads/2018/05/word-image-3603-300x190.png 300w, /wp-content/uploads/2018/05/word-image-3603-768x487.png 768w, /wp-content/uploads/2018/05/word-image-3603-1024x649.png 1024w" sizes="(max-width: 1097px) 100vw, 1097px" /></p>
<p>
  ④查看效果
</p>
<p><img loading="lazy" decoding="async" width="964" height="449" src="/wp-content/uploads/2018/05/word-image-3604.png" class="wp-image-4061" srcset="/wp-content/uploads/2018/05/word-image-3604.png 964w, /wp-content/uploads/2018/05/word-image-3604-300x140.png 300w, /wp-content/uploads/2018/05/word-image-3604-768x358.png 768w" sizes="(max-width: 964px) 100vw, 964px" /></p>
<p>
  从上述结果中可以得知TP默认的是使用pathinfo模式
</p>
<p>
  在TP的配置文件中有一个URL_MODEL控制使用的URL模式
</p>
<p>
  ⑤查看惯例配置中的配置项
</p>
<p><img loading="lazy" decoding="async" width="1149" height="440" src="/wp-content/uploads/2018/05/word-image-3605.png" class="wp-image-4062" srcset="/wp-content/uploads/2018/05/word-image-3605.png 1149w, /wp-content/uploads/2018/05/word-image-3605-300x115.png 300w, /wp-content/uploads/2018/05/word-image-3605-768x294.png 768w, /wp-content/uploads/2018/05/word-image-3605-1024x392.png 1024w" sizes="(max-width: 1149px) 100vw, 1149px" /></p>
<p>
  ⑥查看普通模式的地址
</p>
<p>
  修改URL模式
</p>
<p><img loading="lazy" decoding="async" width="862" height="389" src="/wp-content/uploads/2018/05/word-image-3606.png" class="wp-image-4063" srcset="/wp-content/uploads/2018/05/word-image-3606.png 862w, /wp-content/uploads/2018/05/word-image-3606-300x135.png 300w, /wp-content/uploads/2018/05/word-image-3606-768x347.png 768w" sizes="(max-width: 862px) 100vw, 862px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="864" height="347" src="/wp-content/uploads/2018/05/word-image-3607.png" class="wp-image-4064" srcset="/wp-content/uploads/2018/05/word-image-3607.png 864w, /wp-content/uploads/2018/05/word-image-3607-300x120.png 300w, /wp-content/uploads/2018/05/word-image-3607-768x308.png 768w" sizes="(max-width: 864px) 100vw, 864px" /></p>
<p>
  ⑦查看重写模式地址
</p>
<p><img loading="lazy" decoding="async" width="1102" height="447" src="/wp-content/uploads/2018/05/word-image-3608.png" class="wp-image-4065" srcset="/wp-content/uploads/2018/05/word-image-3608.png 1102w, /wp-content/uploads/2018/05/word-image-3608-300x122.png 300w, /wp-content/uploads/2018/05/word-image-3608-768x312.png 768w, /wp-content/uploads/2018/05/word-image-3608-1024x415.png 1024w" sizes="(max-width: 1102px) 100vw, 1102px" /></p>
<p>
  结果如下
</p>
<p><img loading="lazy" decoding="async" width="786" height="339" src="/wp-content/uploads/2018/05/word-image-3609.png" class="wp-image-4066" srcset="/wp-content/uploads/2018/05/word-image-3609.png 786w, /wp-content/uploads/2018/05/word-image-3609-300x129.png 300w, /wp-content/uploads/2018/05/word-image-3609-768x331.png 768w" sizes="(max-width: 786px) 100vw, 786px" /></p>
<p>
  ⑧查看兼容模式
</p>
<p><img loading="lazy" decoding="async" width="1063" height="379" src="/wp-content/uploads/2018/05/word-image-3610.png" class="wp-image-4067" srcset="/wp-content/uploads/2018/05/word-image-3610.png 1063w, /wp-content/uploads/2018/05/word-image-3610-300x107.png 300w, /wp-content/uploads/2018/05/word-image-3610-768x274.png 768w, /wp-content/uploads/2018/05/word-image-3610-1024x365.png 1024w" sizes="(max-width: 1063px) 100vw, 1063px" /><br />
<img loading="lazy" decoding="async" width="804" height="375" src="/wp-content/uploads/2018/05/word-image-3611.png" class="wp-image-4068" srcset="/wp-content/uploads/2018/05/word-image-3611.png 804w, /wp-content/uploads/2018/05/word-image-3611-300x140.png 300w, /wp-content/uploads/2018/05/word-image-3611-768x358.png 768w" sizes="(max-width: 804px) 100vw, 804px" /></p>
<p>
  注意：TP中的四种URL模式并不是限制项目需要使用哪一种模式进行访问。URL_MODEL配置项的作用是为了控制U函数所生成的URL地址的格式
</p>
<h2>3.8、页面跳转与重定向</h2>
<p>
  关于页面跳转跟重定向功能是经常使用。常见位置在数据操作完成之后的提示信息
</p>
<h3>3.8.1、页面跳转</h3>
<p>
  在TP的控制器基类中提供了两个方法可以实现跳转功能分别为success跟error
</p>
<p>
  ①查看源码位置
</p>
<p><img loading="lazy" decoding="async" width="1087" height="695" src="/wp-content/uploads/2018/05/word-image-3612.png" class="wp-image-4069" srcset="/wp-content/uploads/2018/05/word-image-3612.png 1087w, /wp-content/uploads/2018/05/word-image-3612-300x192.png 300w, /wp-content/uploads/2018/05/word-image-3612-768x491.png 768w, /wp-content/uploads/2018/05/word-image-3612-1024x655.png 1024w" sizes="(max-width: 1087px) 100vw, 1087px" /></p>
<p>
  ②测试成功的方法使用
</p>
<p><img loading="lazy" decoding="async" width="1029" height="505" src="/wp-content/uploads/2018/05/word-image-3613.png" class="wp-image-4070" srcset="/wp-content/uploads/2018/05/word-image-3613.png 1029w, /wp-content/uploads/2018/05/word-image-3613-300x147.png 300w, /wp-content/uploads/2018/05/word-image-3613-768x377.png 768w, /wp-content/uploads/2018/05/word-image-3613-1024x503.png 1024w" sizes="(max-width: 1029px) 100vw, 1029px" /></p>
<p>
  ③测试失败的方法的使用
</p>
<p><img loading="lazy" decoding="async" width="1017" height="482" src="/wp-content/uploads/2018/05/word-image-3614.png" class="wp-image-4071" srcset="/wp-content/uploads/2018/05/word-image-3614.png 1017w, /wp-content/uploads/2018/05/word-image-3614-300x142.png 300w, /wp-content/uploads/2018/05/word-image-3614-768x364.png 768w" sizes="(max-width: 1017px) 100vw, 1017px" /></p>
<p>
  ④关于成功失败跳转的模板文件地址
</p>
<p><img loading="lazy" decoding="async" width="1289" height="643" src="/wp-content/uploads/2018/05/word-image-3615.png" class="wp-image-4072" srcset="/wp-content/uploads/2018/05/word-image-3615.png 1289w, /wp-content/uploads/2018/05/word-image-3615-300x150.png 300w, /wp-content/uploads/2018/05/word-image-3615-768x383.png 768w, /wp-content/uploads/2018/05/word-image-3615-1024x511.png 1024w" sizes="(max-width: 1289px) 100vw, 1289px" /></p>
<h3>3.8.2、页面重定向</h3>
<p>
  ①查看使用方式
</p>
<p><img loading="lazy" decoding="async" width="1098" height="682" src="/wp-content/uploads/2018/05/word-image-3616.png" class="wp-image-4073" srcset="/wp-content/uploads/2018/05/word-image-3616.png 1098w, /wp-content/uploads/2018/05/word-image-3616-300x186.png 300w, /wp-content/uploads/2018/05/word-image-3616-768x477.png 768w, /wp-content/uploads/2018/05/word-image-3616-1024x636.png 1024w" sizes="(max-width: 1098px) 100vw, 1098px" /></p>
<p>
  ②创建方法测试
</p>
<p><img loading="lazy" decoding="async" width="1095" height="545" src="/wp-content/uploads/2018/05/word-image-3617.png" class="wp-image-4074" srcset="/wp-content/uploads/2018/05/word-image-3617.png 1095w, /wp-content/uploads/2018/05/word-image-3617-300x149.png 300w, /wp-content/uploads/2018/05/word-image-3617-768x382.png 768w, /wp-content/uploads/2018/05/word-image-3617-1024x510.png 1024w" sizes="(max-width: 1095px) 100vw, 1095px" /></p>
<p>
  ③查看效果
</p>
<p><img loading="lazy" decoding="async" width="679" height="241" src="/wp-content/uploads/2018/05/word-image-3618.png" class="wp-image-4075" srcset="/wp-content/uploads/2018/05/word-image-3618.png 679w, /wp-content/uploads/2018/05/word-image-3618-300x106.png 300w" sizes="(max-width: 679px) 100vw, 679px" /></p>
<h2>3.9、空控制器与空操作</h2>
<h3>3.9.1、空操作</h3>
<p>
  当用户访问某一个不存在的方法时接下来由单独的一个空操作(对应在控制中的_empty的方法)实现处理请求。
</p>
<p>
  ①增加方法
</p>
<p><img loading="lazy" decoding="async" width="839" height="468" src="/wp-content/uploads/2018/05/word-image-3619.png" class="wp-image-4076" srcset="/wp-content/uploads/2018/05/word-image-3619.png 839w, /wp-content/uploads/2018/05/word-image-3619-300x167.png 300w, /wp-content/uploads/2018/05/word-image-3619-768x428.png 768w" sizes="(max-width: 839px) 100vw, 839px" /></p>
<p>
  ②访问测试
</p>
<p><img loading="lazy" decoding="async" width="1032" height="363" src="/wp-content/uploads/2018/05/word-image-3620.png" class="wp-image-4077" srcset="/wp-content/uploads/2018/05/word-image-3620.png 1032w, /wp-content/uploads/2018/05/word-image-3620-300x106.png 300w, /wp-content/uploads/2018/05/word-image-3620-768x270.png 768w, /wp-content/uploads/2018/05/word-image-3620-1024x360.png 1024w" sizes="(max-width: 1032px) 100vw, 1032px" /></p>
<h3>3.9.2、空控制器</h3>
<p>
  当用户访问一个不存在的控制器时会自动的去执行空控制下对应的方法。
</p>
<p>
  ①先创建空控制器
</p>
<p><img loading="lazy" decoding="async" width="858" height="481" src="/wp-content/uploads/2018/05/word-image-3621.png" class="wp-image-4078" srcset="/wp-content/uploads/2018/05/word-image-3621.png 858w, /wp-content/uploads/2018/05/word-image-3621-300x168.png 300w, /wp-content/uploads/2018/05/word-image-3621-768x431.png 768w" sizes="(max-width: 858px) 100vw, 858px" /></p>
<p>
  ②执行查看效果
</p>
<p><img loading="lazy" decoding="async" width="1094" height="461" src="/wp-content/uploads/2018/05/word-image-3622.png" class="wp-image-4079" srcset="/wp-content/uploads/2018/05/word-image-3622.png 1094w, /wp-content/uploads/2018/05/word-image-3622-300x126.png 300w, /wp-content/uploads/2018/05/word-image-3622-768x324.png 768w, /wp-content/uploads/2018/05/word-image-3622-1024x432.png 1024w" sizes="(max-width: 1094px) 100vw, 1094px" /></p>
<p>
  ③在空控制器中创建空方法
</p>
<p><img loading="lazy" decoding="async" width="936" height="648" src="/wp-content/uploads/2018/05/word-image-3623.png" class="wp-image-4080" srcset="/wp-content/uploads/2018/05/word-image-3623.png 936w, /wp-content/uploads/2018/05/word-image-3623-300x208.png 300w, /wp-content/uploads/2018/05/word-image-3623-768x532.png 768w" sizes="(max-width: 936px) 100vw, 936px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="694" height="184" src="/wp-content/uploads/2018/05/word-image-3624.png" class="wp-image-4081" srcset="/wp-content/uploads/2018/05/word-image-3624.png 694w, /wp-content/uploads/2018/05/word-image-3624-300x80.png 300w" sizes="(max-width: 694px) 100vw, 694px" /></p>
<p>
  备注：最好事先错误的提示页面通过使用web服务器的错误提示设置
</p>
<h1>视图(一)</h1>
<h2>4.1、视图创建规则</h2>
<h3>4.1.1、视图创建规则</h3>
<ol>
<li>
  默认情况下需要将视图的模板文件存储在模块下的view目录中
</li>
<li>
  默认情况下视图存储需要在View下跟控制器同名的目录中
</li>
<li>
  默认情况下视图模板文件名称需要保持跟方法同名后缀为.html的模板
</li>
</ol>
<h3>4.1.2、创建视图</h3>
<p>
  ①创建根控制器同名的目录
</p>
<p><img loading="lazy" decoding="async" width="997" height="187" src="/wp-content/uploads/2018/05/word-image-3625.png" class="wp-image-4082" srcset="/wp-content/uploads/2018/05/word-image-3625.png 997w, /wp-content/uploads/2018/05/word-image-3625-300x56.png 300w, /wp-content/uploads/2018/05/word-image-3625-768x144.png 768w" sizes="(max-width: 997px) 100vw, 997px" /></p>
<p>
  ②创建模板
</p>
<p><img loading="lazy" decoding="async" width="918" height="476" src="/wp-content/uploads/2018/05/word-image-3626.png" class="wp-image-4083" srcset="/wp-content/uploads/2018/05/word-image-3626.png 918w, /wp-content/uploads/2018/05/word-image-3626-300x156.png 300w, /wp-content/uploads/2018/05/word-image-3626-768x398.png 768w" sizes="(max-width: 918px) 100vw, 918px" /></p>
<h2>4.2、控制器调用视图</h2>
<p>
  对于在TP的方法中需要使用视图的模板可以使用两个方法分别为display跟fetch方法。
</p>
<p>
  对于display跟fetch用法一模一样，区别在于display会直接输出模板的结果。Fetch不会直接输出
</p>
<h3>4.2.1、演示display跟fetch的区别</h3>
<p>
  ①创建方法
</p>
<p><img loading="lazy" decoding="async" width="1061" height="596" src="/wp-content/uploads/2018/05/word-image-3627.png" class="wp-image-4084" srcset="/wp-content/uploads/2018/05/word-image-3627.png 1061w, /wp-content/uploads/2018/05/word-image-3627-300x169.png 300w, /wp-content/uploads/2018/05/word-image-3627-768x431.png 768w, /wp-content/uploads/2018/05/word-image-3627-1024x575.png 1024w" sizes="(max-width: 1061px) 100vw, 1061px" /></p>
<p>
  ②查看效果
</p>
<p><img loading="lazy" decoding="async" width="764" height="167" src="/wp-content/uploads/2018/05/word-image-3628.png" class="wp-image-4085" srcset="/wp-content/uploads/2018/05/word-image-3628.png 764w, /wp-content/uploads/2018/05/word-image-3628-300x66.png 300w" sizes="(max-width: 764px) 100vw, 764px" /><br />
<img loading="lazy" decoding="async" width="708" height="259" src="/wp-content/uploads/2018/05/word-image-3629.png" class="wp-image-4086" srcset="/wp-content/uploads/2018/05/word-image-3629.png 708w, /wp-content/uploads/2018/05/word-image-3629-300x110.png 300w" sizes="(max-width: 708px) 100vw, 708px" /></p>
<p>
  修改showtwo方法
</p>
<p><img loading="lazy" decoding="async" width="946" height="587" src="/wp-content/uploads/2018/05/word-image-3630.png" class="wp-image-4087" srcset="/wp-content/uploads/2018/05/word-image-3630.png 946w, /wp-content/uploads/2018/05/word-image-3630-300x186.png 300w, /wp-content/uploads/2018/05/word-image-3630-768x477.png 768w" sizes="(max-width: 946px) 100vw, 946px" /></p>
<p>
  结果如下
</p>
<p><img loading="lazy" decoding="async" width="740" height="323" src="/wp-content/uploads/2018/05/word-image-3631.png" class="wp-image-4088" srcset="/wp-content/uploads/2018/05/word-image-3631.png 740w, /wp-content/uploads/2018/05/word-image-3631-300x131.png 300w" sizes="(max-width: 740px) 100vw, 740px" /></p>
<h3>4.2.2、演示display用法</h3>
<p>
  ①查看使用方式
</p>
<p><img loading="lazy" decoding="async" width="848" height="390" src="/wp-content/uploads/2018/05/word-image-3632.png" class="wp-image-4089" srcset="/wp-content/uploads/2018/05/word-image-3632.png 848w, /wp-content/uploads/2018/05/word-image-3632-300x138.png 300w, /wp-content/uploads/2018/05/word-image-3632-768x353.png 768w" sizes="(max-width: 848px) 100vw, 848px" /></p>
<p>
  ②指定模块方式使用display
</p>
<p>
  创建测试方法
</p>
<p><img loading="lazy" decoding="async" width="898" height="626" src="/wp-content/uploads/2018/05/word-image-3633.png" class="wp-image-4090" srcset="/wp-content/uploads/2018/05/word-image-3633.png 898w, /wp-content/uploads/2018/05/word-image-3633-300x209.png 300w, /wp-content/uploads/2018/05/word-image-3633-768x535.png 768w" sizes="(max-width: 898px) 100vw, 898px" /></p>
<p>
  查看效果
</p>
<p><img loading="lazy" decoding="async" width="654" height="179" src="/wp-content/uploads/2018/05/word-image-3634.png" class="wp-image-4091" srcset="/wp-content/uploads/2018/05/word-image-3634.png 654w, /wp-content/uploads/2018/05/word-image-3634-300x82.png 300w" sizes="(max-width: 654px) 100vw, 654px" /><br />
<img loading="lazy" decoding="async" width="633" height="135" src="/wp-content/uploads/2018/05/word-image-3635.png" class="wp-image-4092" srcset="/wp-content/uploads/2018/05/word-image-3635.png 633w, /wp-content/uploads/2018/05/word-image-3635-300x64.png 300w" sizes="(max-width: 633px) 100vw, 633px" /></p>
<p>
  ③直接指定模板文件地址
</p>
<p>
  创建测试方法
</p>
<p><img loading="lazy" decoding="async" width="1058" height="373" src="/wp-content/uploads/2018/05/word-image-3636.png" class="wp-image-4093" srcset="/wp-content/uploads/2018/05/word-image-3636.png 1058w, /wp-content/uploads/2018/05/word-image-3636-300x106.png 300w, /wp-content/uploads/2018/05/word-image-3636-768x271.png 768w, /wp-content/uploads/2018/05/word-image-3636-1024x361.png 1024w" sizes="(max-width: 1058px) 100vw, 1058px" /></p>
<p>
  查看结果
</p>
<p><img loading="lazy" decoding="async" width="764" height="202" src="/wp-content/uploads/2018/05/word-image-3637.png" class="wp-image-4094" srcset="/wp-content/uploads/2018/05/word-image-3637.png 764w, /wp-content/uploads/2018/05/word-image-3637-300x79.png 300w" sizes="(max-width: 764px) 100vw, 764px" /></p>
<h2>4.3、模板替换</h2>
<p>
  模板替换就是通过在模板中使用TP内置的”模板变量”.TP在每次渲染模板之前都会讲对应的模板变量进行替换
</p>
<h3>4.3.1、内置的模板替换</h3>
<p>
  ①查看文档
</p>
<p>
  在TP有内置的模板变量替换如下
</p>
<p><img loading="lazy" decoding="async" width="885" height="277" src="/wp-content/uploads/2018/05/word-image-3638.png" class="wp-image-4095" srcset="/wp-content/uploads/2018/05/word-image-3638.png 885w, /wp-content/uploads/2018/05/word-image-3638-300x94.png 300w, /wp-content/uploads/2018/05/word-image-3638-768x240.png 768w" sizes="(max-width: 885px) 100vw, 885px" /></p>
<p>
  ②修改show模板查看效果
</p>
<p><img loading="lazy" decoding="async" width="1080" height="675" src="/wp-content/uploads/2018/05/word-image-3639.png" class="wp-image-4096" srcset="/wp-content/uploads/2018/05/word-image-3639.png 1080w, /wp-content/uploads/2018/05/word-image-3639-300x188.png 300w, /wp-content/uploads/2018/05/word-image-3639-768x480.png 768w, /wp-content/uploads/2018/05/word-image-3639-1024x640.png 1024w" sizes="(max-width: 1080px) 100vw, 1080px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="989" height="425" src="/wp-content/uploads/2018/05/word-image-3640.png" class="wp-image-4097" srcset="/wp-content/uploads/2018/05/word-image-3640.png 989w, /wp-content/uploads/2018/05/word-image-3640-300x129.png 300w, /wp-content/uploads/2018/05/word-image-3640-768x330.png 768w" sizes="(max-width: 989px) 100vw, 989px" /></p>
<p>
  最常使用的是__PUBLIC__替换资源地址
</p>
<h3>4.3.2、自定义模板替换</h3>
<p>
  ①增加自定义配置项
</p>
<p><img loading="lazy" decoding="async" width="987" height="525" src="/wp-content/uploads/2018/05/word-image-3641.png" class="wp-image-4098" srcset="/wp-content/uploads/2018/05/word-image-3641.png 987w, /wp-content/uploads/2018/05/word-image-3641-300x160.png 300w, /wp-content/uploads/2018/05/word-image-3641-768x409.png 768w" sizes="(max-width: 987px) 100vw, 987px" /></p>
<p>
  ②模板中使用
</p>
<p><img loading="lazy" decoding="async" width="1068" height="412" src="/wp-content/uploads/2018/05/word-image-3642.png" class="wp-image-4099" srcset="/wp-content/uploads/2018/05/word-image-3642.png 1068w, /wp-content/uploads/2018/05/word-image-3642-300x116.png 300w, /wp-content/uploads/2018/05/word-image-3642-768x296.png 768w, /wp-content/uploads/2018/05/word-image-3642-1024x395.png 1024w" sizes="(max-width: 1068px) 100vw, 1068px" /></p>
<p>
  ③效果如下
</p>
<p><img loading="lazy" decoding="async" width="869" height="257" src="/wp-content/uploads/2018/05/word-image-3643.png" class="wp-image-4100" srcset="/wp-content/uploads/2018/05/word-image-3643.png 869w, /wp-content/uploads/2018/05/word-image-3643-300x89.png 300w, /wp-content/uploads/2018/05/word-image-3643-768x227.png 768w" sizes="(max-width: 869px) 100vw, 869px" /></p>
<h1>案例-搭建电商项目后台</h1>
<h2>5.1、项目部署</h2>
<h3>5.1.1、创建项目</h3>
<p>
  ①创建项目的根目录
</p>
<p><img loading="lazy" decoding="async" width="987" height="294" src="/wp-content/uploads/2018/05/word-image-3644.png" class="wp-image-4101" srcset="/wp-content/uploads/2018/05/word-image-3644.png 987w, /wp-content/uploads/2018/05/word-image-3644-300x89.png 300w, /wp-content/uploads/2018/05/word-image-3644-768x229.png 768w" sizes="(max-width: 987px) 100vw, 987px" /></p>
<p>
  ②创建wwwroot目录
</p>
<p><img loading="lazy" decoding="async" width="890" height="153" src="/wp-content/uploads/2018/05/word-image-3645.png" class="wp-image-4102" srcset="/wp-content/uploads/2018/05/word-image-3645.png 890w, /wp-content/uploads/2018/05/word-image-3645-300x52.png 300w, /wp-content/uploads/2018/05/word-image-3645-768x132.png 768w" sizes="(max-width: 890px) 100vw, 890px" /></p>
<p>
  ③拷贝TP的框架源代码
</p>
<p><img loading="lazy" decoding="async" width="1159" height="358" src="/wp-content/uploads/2018/05/word-image-3646.png" class="wp-image-4103" srcset="/wp-content/uploads/2018/05/word-image-3646.png 1159w, /wp-content/uploads/2018/05/word-image-3646-300x93.png 300w, /wp-content/uploads/2018/05/word-image-3646-768x237.png 768w, /wp-content/uploads/2018/05/word-image-3646-1024x316.png 1024w" sizes="(max-width: 1159px) 100vw, 1159px" /></p>
<p>
  ④拷贝入口文件及重写规则文件
</p>
<p><img loading="lazy" decoding="async" width="1212" height="376" src="/wp-content/uploads/2018/05/word-image-3647.png" class="wp-image-4104" srcset="/wp-content/uploads/2018/05/word-image-3647.png 1212w, /wp-content/uploads/2018/05/word-image-3647-300x93.png 300w, /wp-content/uploads/2018/05/word-image-3647-768x238.png 768w, /wp-content/uploads/2018/05/word-image-3647-1024x318.png 1024w" sizes="(max-width: 1212px) 100vw, 1212px" /></p>
<h3>5.1.2、配置虚拟主机</h3>
<p>
  ①增加虚拟主机
</p>
<p><img loading="lazy" decoding="async" width="1053" height="449" src="/wp-content/uploads/2018/05/word-image-3648.png" class="wp-image-4105" srcset="/wp-content/uploads/2018/05/word-image-3648.png 1053w, /wp-content/uploads/2018/05/word-image-3648-300x128.png 300w, /wp-content/uploads/2018/05/word-image-3648-768x327.png 768w, /wp-content/uploads/2018/05/word-image-3648-1024x437.png 1024w" sizes="(max-width: 1053px) 100vw, 1053px" /></p>
<p>
  ②修改hosts文件
</p>
<p><img loading="lazy" decoding="async" width="864" height="408" src="/wp-content/uploads/2018/05/word-image-3649.png" class="wp-image-4106" srcset="/wp-content/uploads/2018/05/word-image-3649.png 864w, /wp-content/uploads/2018/05/word-image-3649-300x142.png 300w, /wp-content/uploads/2018/05/word-image-3649-768x363.png 768w" sizes="(max-width: 864px) 100vw, 864px" /></p>
<p>
  ③修改入口文件
</p>
<p><img loading="lazy" decoding="async" width="996" height="553" src="/wp-content/uploads/2018/05/word-image-3650.png" class="wp-image-4107" srcset="/wp-content/uploads/2018/05/word-image-3650.png 996w, /wp-content/uploads/2018/05/word-image-3650-300x167.png 300w, /wp-content/uploads/2018/05/word-image-3650-768x426.png 768w" sizes="(max-width: 996px) 100vw, 996px" /></p>
<p>
  ④重启Apache访问查看
</p>
<p><img loading="lazy" decoding="async" width="978" height="447" src="/wp-content/uploads/2018/05/word-image-3651.png" class="wp-image-4108" srcset="/wp-content/uploads/2018/05/word-image-3651.png 978w, /wp-content/uploads/2018/05/word-image-3651-300x137.png 300w, /wp-content/uploads/2018/05/word-image-3651-768x351.png 768w" sizes="(max-width: 978px) 100vw, 978px" /></p>
<p>
  查看目录结构
</p>
<p><img loading="lazy" decoding="async" width="642" height="366" src="/wp-content/uploads/2018/05/word-image-3652.png" class="wp-image-4109" srcset="/wp-content/uploads/2018/05/word-image-3652.png 642w, /wp-content/uploads/2018/05/word-image-3652-300x171.png 300w" sizes="(max-width: 642px) 100vw, 642px" /></p>
<p>
  对于此方式部署项目由于域名解析的目录下只有入口文件。因此项目的安全性更好
</p>
<h2>5.2、创建后台模块</h2>
<p>
  ①复制Home模块为Admin
</p>
<p><img loading="lazy" decoding="async" width="950" height="253" src="/wp-content/uploads/2018/05/word-image-3653.png" class="wp-image-4110" srcset="/wp-content/uploads/2018/05/word-image-3653.png 950w, /wp-content/uploads/2018/05/word-image-3653-300x80.png 300w, /wp-content/uploads/2018/05/word-image-3653-768x205.png 768w" sizes="(max-width: 950px) 100vw, 950px" /></p>
<p>
  ②修改后台模块下的index控制器
</p>
<p><img loading="lazy" decoding="async" width="1021" height="483" src="/wp-content/uploads/2018/05/word-image-3654.png" class="wp-image-4111" srcset="/wp-content/uploads/2018/05/word-image-3654.png 1021w, /wp-content/uploads/2018/05/word-image-3654-300x142.png 300w, /wp-content/uploads/2018/05/word-image-3654-768x363.png 768w" sizes="(max-width: 1021px) 100vw, 1021px" /></p>
<p>
  ③访问查看
</p>
<p><img loading="lazy" decoding="async" width="1086" height="261" src="/wp-content/uploads/2018/05/word-image-3655.png" class="wp-image-4112" srcset="/wp-content/uploads/2018/05/word-image-3655.png 1086w, /wp-content/uploads/2018/05/word-image-3655-300x72.png 300w, /wp-content/uploads/2018/05/word-image-3655-768x185.png 768w, /wp-content/uploads/2018/05/word-image-3655-1024x246.png 1024w" sizes="(max-width: 1086px) 100vw, 1086px" /></p>
<h2>5.3、处理URL地址</h2>
<h3>5.3.1、隐藏入口文件</h3>
<p>
  ①修改Apache的配置启用重写模式
</p>
<p><img loading="lazy" decoding="async" width="806" height="359" src="/wp-content/uploads/2018/05/word-image-3656.png" class="wp-image-4113" srcset="/wp-content/uploads/2018/05/word-image-3656.png 806w, /wp-content/uploads/2018/05/word-image-3656-300x134.png 300w, /wp-content/uploads/2018/05/word-image-3656-768x342.png 768w" sizes="(max-width: 806px) 100vw, 806px" /></p>
<p>
  ②设置虚拟主机可以重启
</p>
<p><img loading="lazy" decoding="async" width="948" height="486" src="/wp-content/uploads/2018/05/word-image-3657.png" class="wp-image-4114" srcset="/wp-content/uploads/2018/05/word-image-3657.png 948w, /wp-content/uploads/2018/05/word-image-3657-300x154.png 300w, /wp-content/uploads/2018/05/word-image-3657-768x394.png 768w" sizes="(max-width: 948px) 100vw, 948px" /></p>
<p>
  重写规则文件已经拷贝
</p>
<p>
  ③重启Apache访问测试
</p>
<p><img loading="lazy" decoding="async" width="969" height="470" src="/wp-content/uploads/2018/05/word-image-3658.png" class="wp-image-4115" srcset="/wp-content/uploads/2018/05/word-image-3658.png 969w, /wp-content/uploads/2018/05/word-image-3658-300x146.png 300w, /wp-content/uploads/2018/05/word-image-3658-768x373.png 768w" sizes="(max-width: 969px) 100vw, 969px" /></p>
<p>
  ④创建测试方法使用U函数生成
</p>
<p><img loading="lazy" decoding="async" width="929" height="479" src="/wp-content/uploads/2018/05/word-image-3659.png" class="wp-image-4116" srcset="/wp-content/uploads/2018/05/word-image-3659.png 929w, /wp-content/uploads/2018/05/word-image-3659-300x155.png 300w, /wp-content/uploads/2018/05/word-image-3659-768x396.png 768w" sizes="(max-width: 929px) 100vw, 929px" /></p>
<p>
  ⑤访问测试
</p>
<p><img loading="lazy" decoding="async" width="498" height="206" src="/wp-content/uploads/2018/05/word-image-3660.png" class="wp-image-4117" srcset="/wp-content/uploads/2018/05/word-image-3660.png 498w, /wp-content/uploads/2018/05/word-image-3660-300x124.png 300w" sizes="(max-width: 498px) 100vw, 498px" /></p>
<p>
  ⑥设置为重写模式
</p>
<p><img loading="lazy" decoding="async" width="981" height="416" src="/wp-content/uploads/2018/05/word-image-3661.png" class="wp-image-4118" srcset="/wp-content/uploads/2018/05/word-image-3661.png 981w, /wp-content/uploads/2018/05/word-image-3661-300x127.png 300w, /wp-content/uploads/2018/05/word-image-3661-768x326.png 768w" sizes="(max-width: 981px) 100vw, 981px" /></p>
<p>
  再次查看效果
</p>
<p><img loading="lazy" decoding="async" width="517" height="176" src="/wp-content/uploads/2018/05/word-image-3662.png" class="wp-image-4119" srcset="/wp-content/uploads/2018/05/word-image-3662.png 517w, /wp-content/uploads/2018/05/word-image-3662-300x102.png 300w" sizes="(max-width: 517px) 100vw, 517px" /></p>
<h3>5.3.2、隐藏Home模块</h3>
<p>
  ①设置默认的模块以及容许访问的模块
</p>
<p><img loading="lazy" decoding="async" width="967" height="472" src="/wp-content/uploads/2018/05/word-image-3663.png" class="wp-image-4120" srcset="/wp-content/uploads/2018/05/word-image-3663.png 967w, /wp-content/uploads/2018/05/word-image-3663-300x146.png 300w, /wp-content/uploads/2018/05/word-image-3663-768x375.png 768w" sizes="(max-width: 967px) 100vw, 967px" /></p>
<p>
  ②查看效果
</p>
<p><img loading="lazy" decoding="async" width="824" height="209" src="/wp-content/uploads/2018/05/word-image-3664.png" class="wp-image-4121" srcset="/wp-content/uploads/2018/05/word-image-3664.png 824w, /wp-content/uploads/2018/05/word-image-3664-300x76.png 300w, /wp-content/uploads/2018/05/word-image-3664-768x195.png 768w" sizes="(max-width: 824px) 100vw, 824px" /></p>
<h2>5.4、实现后台的首页显示</h2>
<p>
  ①修改Index控制器代码
</p>
<p><img loading="lazy" decoding="async" width="948" height="476" src="/wp-content/uploads/2018/05/word-image-3665.png" class="wp-image-4122" srcset="/wp-content/uploads/2018/05/word-image-3665.png 948w, /wp-content/uploads/2018/05/word-image-3665-300x151.png 300w, /wp-content/uploads/2018/05/word-image-3665-768x386.png 768w" sizes="(max-width: 948px) 100vw, 948px" /></p>
<p>
  ②创建视图目录
</p>
<p><img loading="lazy" decoding="async" width="926" height="210" src="/wp-content/uploads/2018/05/word-image-3666.png" class="wp-image-4123" srcset="/wp-content/uploads/2018/05/word-image-3666.png 926w, /wp-content/uploads/2018/05/word-image-3666-300x68.png 300w, /wp-content/uploads/2018/05/word-image-3666-768x174.png 768w" sizes="(max-width: 926px) 100vw, 926px" /></p>
<p>
  ③拷贝首页模板
</p>
<p><img loading="lazy" decoding="async" width="1287" height="541" src="/wp-content/uploads/2018/05/word-image-3667.png" class="wp-image-4124" srcset="/wp-content/uploads/2018/05/word-image-3667.png 1287w, /wp-content/uploads/2018/05/word-image-3667-300x126.png 300w, /wp-content/uploads/2018/05/word-image-3667-768x323.png 768w, /wp-content/uploads/2018/05/word-image-3667-1024x430.png 1024w" sizes="(max-width: 1287px) 100vw, 1287px" /></p>
<p>
  ④查看效果
</p>
<p><img loading="lazy" decoding="async" width="956" height="399" src="/wp-content/uploads/2018/05/word-image-3668.png" class="wp-image-4125" srcset="/wp-content/uploads/2018/05/word-image-3668.png 956w, /wp-content/uploads/2018/05/word-image-3668-300x125.png 300w, /wp-content/uploads/2018/05/word-image-3668-768x321.png 768w" sizes="(max-width: 956px) 100vw, 956px" /></p>
<p>
  ⑤拷贝其他模板
</p>
<p><img loading="lazy" decoding="async" width="1312" height="517" src="/wp-content/uploads/2018/05/word-image-3669.png" class="wp-image-4126" srcset="/wp-content/uploads/2018/05/word-image-3669.png 1312w, /wp-content/uploads/2018/05/word-image-3669-300x118.png 300w, /wp-content/uploads/2018/05/word-image-3669-768x303.png 768w, /wp-content/uploads/2018/05/word-image-3669-1024x404.png 1024w" sizes="(max-width: 1312px) 100vw, 1312px" /></p>
<p>
  ⑥查看效果
</p>
<p><img loading="lazy" decoding="async" width="1174" height="381" src="/wp-content/uploads/2018/05/word-image-3670.png" class="wp-image-4127" srcset="/wp-content/uploads/2018/05/word-image-3670.png 1174w, /wp-content/uploads/2018/05/word-image-3670-300x97.png 300w, /wp-content/uploads/2018/05/word-image-3670-768x249.png 768w, /wp-content/uploads/2018/05/word-image-3670-1024x332.png 1024w" sizes="(max-width: 1174px) 100vw, 1174px" /><br />
<img loading="lazy" decoding="async" width="782" height="169" src="/wp-content/uploads/2018/05/word-image-3671.png" class="wp-image-4128" srcset="/wp-content/uploads/2018/05/word-image-3671.png 782w, /wp-content/uploads/2018/05/word-image-3671-300x65.png 300w, /wp-content/uploads/2018/05/word-image-3671-768x166.png 768w" sizes="(max-width: 782px) 100vw, 782px" /></p>
<p>
  ⑦修改首页的模板
</p>
<p><img loading="lazy" decoding="async" width="1088" height="610" src="/wp-content/uploads/2018/05/word-image-3672.png" class="wp-image-4129" srcset="/wp-content/uploads/2018/05/word-image-3672.png 1088w, /wp-content/uploads/2018/05/word-image-3672-300x168.png 300w, /wp-content/uploads/2018/05/word-image-3672-768x431.png 768w, /wp-content/uploads/2018/05/word-image-3672-1024x574.png 1024w" sizes="(max-width: 1088px) 100vw, 1088px" /></p>
<h2>5.5、处理后台资源地址</h2>
<p>
  ①拷贝资源文件
</p>
<p><img loading="lazy" decoding="async" width="1318" height="419" src="/wp-content/uploads/2018/05/word-image-3673.png" class="wp-image-4130" srcset="/wp-content/uploads/2018/05/word-image-3673.png 1318w, /wp-content/uploads/2018/05/word-image-3673-300x95.png 300w, /wp-content/uploads/2018/05/word-image-3673-768x244.png 768w, /wp-content/uploads/2018/05/word-image-3673-1024x326.png 1024w" sizes="(max-width: 1318px) 100vw, 1318px" /></p>
<p>
  ②自定义模板替换
</p>
<p><img loading="lazy" decoding="async" width="935" height="534" src="/wp-content/uploads/2018/05/word-image-3674.png" class="wp-image-4131" srcset="/wp-content/uploads/2018/05/word-image-3674.png 935w, /wp-content/uploads/2018/05/word-image-3674-300x171.png 300w, /wp-content/uploads/2018/05/word-image-3674-768x439.png 768w" sizes="(max-width: 935px) 100vw, 935px" /></p>
<p>
  ③修改top模板
</p>
<p><img loading="lazy" decoding="async" width="1073" height="453" src="/wp-content/uploads/2018/05/word-image-3675.png" class="wp-image-4132" srcset="/wp-content/uploads/2018/05/word-image-3675.png 1073w, /wp-content/uploads/2018/05/word-image-3675-300x127.png 300w, /wp-content/uploads/2018/05/word-image-3675-768x324.png 768w, /wp-content/uploads/2018/05/word-image-3675-1024x432.png 1024w" sizes="(max-width: 1073px) 100vw, 1073px" /></p>
<p>
  ④修改menu模板
</p>
<p><img loading="lazy" decoding="async" width="1079" height="491" src="/wp-content/uploads/2018/05/word-image-3676.png" class="wp-image-4133" srcset="/wp-content/uploads/2018/05/word-image-3676.png 1079w, /wp-content/uploads/2018/05/word-image-3676-300x137.png 300w, /wp-content/uploads/2018/05/word-image-3676-768x349.png 768w, /wp-content/uploads/2018/05/word-image-3676-1024x466.png 1024w" sizes="(max-width: 1079px) 100vw, 1079px" /></p>
<p>
  ⑤修改main模板
</p>
<p><img loading="lazy" decoding="async" width="1076" height="525" src="/wp-content/uploads/2018/05/word-image-3677.png" class="wp-image-4134" srcset="/wp-content/uploads/2018/05/word-image-3677.png 1076w, /wp-content/uploads/2018/05/word-image-3677-300x146.png 300w, /wp-content/uploads/2018/05/word-image-3677-768x375.png 768w, /wp-content/uploads/2018/05/word-image-3677-1024x500.png 1024w" sizes="(max-width: 1076px) 100vw, 1076px" /></p>
]]></content:encoded>
					
					<wfw:commentRss>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4022.html/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>TP 3.2 （二）视图、模板变量、模板函数、Foreach、Volist、D、M、模型 CURD、电商案例之分类添加</title>
		<link>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/3905.html</link>
					<comments>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/3905.html#respond</comments>
		
		<dc:creator><![CDATA[Mr.Lee]]></dc:creator>
		<pubDate>Sat, 19 May 2018 13:07:18 +0000</pubDate>
				<category><![CDATA[TP3.2]]></category>
		<category><![CDATA[后台框架]]></category>
		<category><![CDATA[D]]></category>
		<category><![CDATA[Foreach]]></category>
		<category><![CDATA[M]]></category>
		<category><![CDATA[Volist]]></category>
		<category><![CDATA[模型 CURD]]></category>
		<category><![CDATA[模板函数]]></category>
		<category><![CDATA[模板变量]]></category>
		<category><![CDATA[电商案例之分类添加]]></category>
		<category><![CDATA[视图]]></category>
		<guid isPermaLink="false">/?p=3905</guid>

					<description><![CDATA[视图(二) 1.1、模板变量 在模板中直接使用变量对数据进行输入显示。 1.1.1、使用assign赋值数据  [&#8230;]]]></description>
										<content:encoded><![CDATA[<h1>视图(二)</h1>
<h2>1.1、模板变量</h2>
<p>
  在模板中直接使用变量对数据进行输入显示。
</p>
<h3>1.1.1、使用assign赋值数据</h3>
<p>
  ①创建方法赋值变量
</p>
<p><img loading="lazy" decoding="async" width="1064" height="621" src="/wp-content/uploads/2018/05/word-image-3451.png" class="wp-image-3906" srcset="/wp-content/uploads/2018/05/word-image-3451.png 1064w, /wp-content/uploads/2018/05/word-image-3451-300x175.png 300w, /wp-content/uploads/2018/05/word-image-3451-768x448.png 768w, /wp-content/uploads/2018/05/word-image-3451-1024x598.png 1024w" sizes="(max-width: 1064px) 100vw, 1064px" /></p>
<p>
  ②创建模板
</p>
<p><img loading="lazy" decoding="async" width="978" height="594" src="/wp-content/uploads/2018/05/word-image-3452.png" class="wp-image-3907" srcset="/wp-content/uploads/2018/05/word-image-3452.png 978w, /wp-content/uploads/2018/05/word-image-3452-300x182.png 300w, /wp-content/uploads/2018/05/word-image-3452-768x466.png 768w" sizes="(max-width: 978px) 100vw, 978px" /></p>
<p>
  ③查看效果
</p>
<p><img loading="lazy" decoding="async" width="701" height="242" src="/wp-content/uploads/2018/05/word-image-3453.png" class="wp-image-3908" srcset="/wp-content/uploads/2018/05/word-image-3453.png 701w, /wp-content/uploads/2018/05/word-image-3453-300x104.png 300w" sizes="(max-width: 701px) 100vw, 701px" /></p>
<p>
  关于模板引擎的配置项如下
</p>
<p><img loading="lazy" decoding="async" width="1108" height="698" src="/wp-content/uploads/2018/05/word-image-3454.png" class="wp-image-3909" srcset="/wp-content/uploads/2018/05/word-image-3454.png 1108w, /wp-content/uploads/2018/05/word-image-3454-300x189.png 300w, /wp-content/uploads/2018/05/word-image-3454-768x484.png 768w, /wp-content/uploads/2018/05/word-image-3454-1024x645.png 1024w" sizes="(max-width: 1108px) 100vw, 1108px" /></p>
<h3>1.1.2、模板赋值基本数据</h3>
<p>
  ①创建测试方法
</p>
<p><img loading="lazy" decoding="async" width="881" height="564" src="/wp-content/uploads/2018/05/word-image-3455.png" class="wp-image-3910" srcset="/wp-content/uploads/2018/05/word-image-3455.png 881w, /wp-content/uploads/2018/05/word-image-3455-300x192.png 300w, /wp-content/uploads/2018/05/word-image-3455-768x492.png 768w" sizes="(max-width: 881px) 100vw, 881px" /></p>
<p>
  ②创建模板
</p>
<p><img loading="lazy" decoding="async" width="769" height="529" src="/wp-content/uploads/2018/05/word-image-3456.png" class="wp-image-3911" srcset="/wp-content/uploads/2018/05/word-image-3456.png 769w, /wp-content/uploads/2018/05/word-image-3456-300x206.png 300w, /wp-content/uploads/2018/05/word-image-3456-768x528.png 768w, /wp-content/uploads/2018/05/word-image-3456-220x150.png 220w" sizes="(max-width: 769px) 100vw, 769px" /></p>
<p>
  ③效果
</p>
<p><img loading="lazy" decoding="async" width="640" height="239" src="/wp-content/uploads/2018/05/word-image-3457.png" class="wp-image-3912" srcset="/wp-content/uploads/2018/05/word-image-3457.png 640w, /wp-content/uploads/2018/05/word-image-3457-300x112.png 300w" sizes="(max-width: 640px) 100vw, 640px" /></p>
<h3>1.1.3、模板赋值数组</h3>
<p>
  ①创建测试方法
</p>
<p><img loading="lazy" decoding="async" width="1000" height="507" src="/wp-content/uploads/2018/05/word-image-3458.png" class="wp-image-3913" srcset="/wp-content/uploads/2018/05/word-image-3458.png 1000w, /wp-content/uploads/2018/05/word-image-3458-300x152.png 300w, /wp-content/uploads/2018/05/word-image-3458-768x389.png 768w" sizes="(max-width: 1000px) 100vw, 1000px" /></p>
<p>
  ②编写模板
</p>
<p><img loading="lazy" decoding="async" width="961" height="546" src="/wp-content/uploads/2018/05/word-image-3459.png" class="wp-image-3914" srcset="/wp-content/uploads/2018/05/word-image-3459.png 961w, /wp-content/uploads/2018/05/word-image-3459-300x170.png 300w, /wp-content/uploads/2018/05/word-image-3459-768x436.png 768w" sizes="(max-width: 961px) 100vw, 961px" /></p>
<p>
  ③效果
</p>
<p><img loading="lazy" decoding="async" width="653" height="213" src="/wp-content/uploads/2018/05/word-image-3460.png" class="wp-image-3915" srcset="/wp-content/uploads/2018/05/word-image-3460.png 653w, /wp-content/uploads/2018/05/word-image-3460-300x98.png 300w" sizes="(max-width: 653px) 100vw, 653px" /></p>
<p>
  ④查看模板解析之后的结果
</p>
<p><img loading="lazy" decoding="async" width="1080" height="607" src="/wp-content/uploads/2018/05/word-image-3461.png" class="wp-image-3916" srcset="/wp-content/uploads/2018/05/word-image-3461.png 1080w, /wp-content/uploads/2018/05/word-image-3461-300x169.png 300w, /wp-content/uploads/2018/05/word-image-3461-768x432.png 768w, /wp-content/uploads/2018/05/word-image-3461-1024x576.png 1024w" sizes="(max-width: 1080px) 100vw, 1080px" /></p>
<h3>1.1.4、模板赋值对象</h3>
<p>
  ①创建方法赋值对象
</p>
<p><img loading="lazy" decoding="async" width="894" height="656" src="/wp-content/uploads/2018/05/word-image-3462.png" class="wp-image-3917" srcset="/wp-content/uploads/2018/05/word-image-3462.png 894w, /wp-content/uploads/2018/05/word-image-3462-300x220.png 300w, /wp-content/uploads/2018/05/word-image-3462-768x564.png 768w" sizes="(max-width: 894px) 100vw, 894px" /></p>
<p>
  ②模板
</p>
<p><img loading="lazy" decoding="async" width="898" height="497" src="/wp-content/uploads/2018/05/word-image-3463.png" class="wp-image-3918" srcset="/wp-content/uploads/2018/05/word-image-3463.png 898w, /wp-content/uploads/2018/05/word-image-3463-300x166.png 300w, /wp-content/uploads/2018/05/word-image-3463-768x425.png 768w" sizes="(max-width: 898px) 100vw, 898px" /></p>
<p>
  ③效果
</p>
<p><img loading="lazy" decoding="async" width="627" height="160" src="/wp-content/uploads/2018/05/word-image-3464.png" class="wp-image-3919" srcset="/wp-content/uploads/2018/05/word-image-3464.png 627w, /wp-content/uploads/2018/05/word-image-3464-300x77.png 300w" sizes="(max-width: 627px) 100vw, 627px" /></p>
<h2>1.2、系统模板变量</h2>
<p>
  对于普通的模板变量需要在方法中进行赋值在模板中才能使用。对于有些数据。是属于经常使用。每次赋值就会比较麻烦。因此TP在系统运行过程中已经讲变量赋值给了模板。可以在模板中直接使用。
</p>
<h3>1.2.1、在控制器中赋值数据</h3>
<p>
  ①创建测试方法
</p>
<p><img loading="lazy" decoding="async" width="935" height="479" src="/wp-content/uploads/2018/05/word-image-3465.png" class="wp-image-3920" srcset="/wp-content/uploads/2018/05/word-image-3465.png 935w, /wp-content/uploads/2018/05/word-image-3465-300x154.png 300w, /wp-content/uploads/2018/05/word-image-3465-768x393.png 768w" sizes="(max-width: 935px) 100vw, 935px" /></p>
<p>
  ②模板显示
</p>
<p><img loading="lazy" decoding="async" width="944" height="559" src="/wp-content/uploads/2018/05/word-image-3466.png" class="wp-image-3921" srcset="/wp-content/uploads/2018/05/word-image-3466.png 944w, /wp-content/uploads/2018/05/word-image-3466-300x178.png 300w, /wp-content/uploads/2018/05/word-image-3466-768x455.png 768w" sizes="(max-width: 944px) 100vw, 944px" /></p>
<p>
  ③效果如下
</p>
<p><img loading="lazy" decoding="async" width="606" height="182" src="/wp-content/uploads/2018/05/word-image-3467.png" class="wp-image-3922" srcset="/wp-content/uploads/2018/05/word-image-3467.png 606w, /wp-content/uploads/2018/05/word-image-3467-300x90.png 300w" sizes="(max-width: 606px) 100vw, 606px" /></p>
<h3>1.2.2、系统模板变量的作用</h3>
<ol>
<li>
  可以显示TP或者PHP中的内置常量
</li>
<li>
  显示PHP的超全局变量例如 $_GET、$_POST、$_REQUEST等
</li>
</ol>
<p>
  3、显示TP的配置信息
</p>
<h3>1.2.3、案例查看</h3>
<p>
  ①创建方法渲染模板
</p>
<p><img loading="lazy" decoding="async" width="817" height="440" src="/wp-content/uploads/2018/05/word-image-3468.png" class="wp-image-3923" srcset="/wp-content/uploads/2018/05/word-image-3468.png 817w, /wp-content/uploads/2018/05/word-image-3468-300x162.png 300w, /wp-content/uploads/2018/05/word-image-3468-768x414.png 768w" sizes="(max-width: 817px) 100vw, 817px" /></p>
<p>
  ②创建模板
</p>
<p><img loading="lazy" decoding="async" width="958" height="547" src="/wp-content/uploads/2018/05/word-image-3469.png" class="wp-image-3924" srcset="/wp-content/uploads/2018/05/word-image-3469.png 958w, /wp-content/uploads/2018/05/word-image-3469-300x171.png 300w, /wp-content/uploads/2018/05/word-image-3469-768x439.png 768w" sizes="(max-width: 958px) 100vw, 958px" /></p>
<p>
  ③效果
</p>
<p><img loading="lazy" decoding="async" width="794" height="287" src="/wp-content/uploads/2018/05/word-image-3470.png" class="wp-image-3925" srcset="/wp-content/uploads/2018/05/word-image-3470.png 794w, /wp-content/uploads/2018/05/word-image-3470-300x108.png 300w, /wp-content/uploads/2018/05/word-image-3470-768x278.png 768w" sizes="(max-width: 794px) 100vw, 794px" /></p>
<h2>1.3、模板函数(重点)</h2>
<h3>1.3.1、在控制器中实现格式化</h3>
<p>
  ①创建方法格式化数据
</p>
<p><img loading="lazy" decoding="async" width="1042" height="681" src="/wp-content/uploads/2018/05/word-image-3471.png" class="wp-image-3926" srcset="/wp-content/uploads/2018/05/word-image-3471.png 1042w, /wp-content/uploads/2018/05/word-image-3471-300x196.png 300w, /wp-content/uploads/2018/05/word-image-3471-768x502.png 768w, /wp-content/uploads/2018/05/word-image-3471-1024x669.png 1024w" sizes="(max-width: 1042px) 100vw, 1042px" /></p>
<p>
  ②处理模板
</p>
<p><img loading="lazy" decoding="async" width="972" height="495" src="/wp-content/uploads/2018/05/word-image-3472.png" class="wp-image-3927" srcset="/wp-content/uploads/2018/05/word-image-3472.png 972w, /wp-content/uploads/2018/05/word-image-3472-300x153.png 300w, /wp-content/uploads/2018/05/word-image-3472-768x391.png 768w" sizes="(max-width: 972px) 100vw, 972px" /></p>
<p>
  ③效果
</p>
<p><img loading="lazy" decoding="async" width="906" height="182" src="/wp-content/uploads/2018/05/word-image-3473.png" class="wp-image-3928" srcset="/wp-content/uploads/2018/05/word-image-3473.png 906w, /wp-content/uploads/2018/05/word-image-3473-300x60.png 300w, /wp-content/uploads/2018/05/word-image-3473-768x154.png 768w" sizes="(max-width: 906px) 100vw, 906px" /></p>
<p>
  对于此方式虽然能后正常的显示内容。但是操作麻烦因此可以使用模板函数实现格式化的操作
</p>
<h3>1.3.2、使用模板函数进行数据格式化</h3>
<p>
  在模板中使用函数可以使用PHP内置的或者是TP所提供的公共函数以及自己定义的公共函数。
</p>
<p>
  ①创建测试方法
</p>
<p><img loading="lazy" decoding="async" width="1002" height="585" src="/wp-content/uploads/2018/05/word-image-3474.png" class="wp-image-3929" srcset="/wp-content/uploads/2018/05/word-image-3474.png 1002w, /wp-content/uploads/2018/05/word-image-3474-300x175.png 300w, /wp-content/uploads/2018/05/word-image-3474-768x448.png 768w" sizes="(max-width: 1002px) 100vw, 1002px" /></p>
<p>
  ②创建模板
</p>
<p><img loading="lazy" decoding="async" width="1030" height="563" src="/wp-content/uploads/2018/05/word-image-3475.png" class="wp-image-3930" srcset="/wp-content/uploads/2018/05/word-image-3475.png 1030w, /wp-content/uploads/2018/05/word-image-3475-300x164.png 300w, /wp-content/uploads/2018/05/word-image-3475-768x420.png 768w, /wp-content/uploads/2018/05/word-image-3475-1024x560.png 1024w" sizes="(max-width: 1030px) 100vw, 1030px" /></p>
<p>
  ③效果如下
</p>
<p><img loading="lazy" decoding="async" width="543" height="159" src="/wp-content/uploads/2018/05/word-image-3476.png" class="wp-image-3931" srcset="/wp-content/uploads/2018/05/word-image-3476.png 543w, /wp-content/uploads/2018/05/word-image-3476-300x88.png 300w" sizes="(max-width: 543px) 100vw, 543px" /></p>
<h3>1.3.3、案例二将字符串转换大写</h3>
<p>
  ①测试方法
</p>
<p><img loading="lazy" decoding="async" width="756" height="361" src="/wp-content/uploads/2018/05/word-image-3477.png" class="wp-image-3932" srcset="/wp-content/uploads/2018/05/word-image-3477.png 756w, /wp-content/uploads/2018/05/word-image-3477-300x143.png 300w" sizes="(max-width: 756px) 100vw, 756px" /></p>
<p>
  ②编写模板
</p>
<p><img loading="lazy" decoding="async" width="945" height="544" src="/wp-content/uploads/2018/05/word-image-3478.png" class="wp-image-3933" srcset="/wp-content/uploads/2018/05/word-image-3478.png 945w, /wp-content/uploads/2018/05/word-image-3478-300x173.png 300w, /wp-content/uploads/2018/05/word-image-3478-768x442.png 768w" sizes="(max-width: 945px) 100vw, 945px" /></p>
<p>
  结果如下
</p>
<p><img loading="lazy" decoding="async" width="720" height="261" src="/wp-content/uploads/2018/05/word-image-3479.png" class="wp-image-3934" srcset="/wp-content/uploads/2018/05/word-image-3479.png 720w, /wp-content/uploads/2018/05/word-image-3479-300x109.png 300w" sizes="(max-width: 720px) 100vw, 720px" /></p>
<h3>1.3.4、模板中使用多个函数格式化处理</h3>
<p>
  ①修改模板
</p>
<p><img loading="lazy" decoding="async" width="1037" height="543" src="/wp-content/uploads/2018/05/word-image-3480.png" class="wp-image-3935" srcset="/wp-content/uploads/2018/05/word-image-3480.png 1037w, /wp-content/uploads/2018/05/word-image-3480-300x157.png 300w, /wp-content/uploads/2018/05/word-image-3480-768x402.png 768w, /wp-content/uploads/2018/05/word-image-3480-1024x536.png 1024w" sizes="(max-width: 1037px) 100vw, 1037px" /></p>
<p>
  ②查看效果
</p>
<p><img loading="lazy" decoding="async" width="693" height="299" src="/wp-content/uploads/2018/05/word-image-3481.png" class="wp-image-3936" srcset="/wp-content/uploads/2018/05/word-image-3481.png 693w, /wp-content/uploads/2018/05/word-image-3481-300x129.png 300w" sizes="(max-width: 693px) 100vw, 693px" /></p>
<h3>1.3.5、使用PHP原生写法格式化</h3>
<p>
  修改模板
</p>
<p><img loading="lazy" decoding="async" width="1041" height="615" src="/wp-content/uploads/2018/05/word-image-3482.png" class="wp-image-3937" srcset="/wp-content/uploads/2018/05/word-image-3482.png 1041w, /wp-content/uploads/2018/05/word-image-3482-300x177.png 300w, /wp-content/uploads/2018/05/word-image-3482-768x454.png 768w, /wp-content/uploads/2018/05/word-image-3482-1024x605.png 1024w" sizes="(max-width: 1041px) 100vw, 1041px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="856" height="314" src="/wp-content/uploads/2018/05/word-image-3483.png" class="wp-image-3938" srcset="/wp-content/uploads/2018/05/word-image-3483.png 856w, /wp-content/uploads/2018/05/word-image-3483-300x110.png 300w, /wp-content/uploads/2018/05/word-image-3483-768x282.png 768w" sizes="(max-width: 856px) 100vw, 856px" /></p>
<h3>1.3.6、格式化特殊写法</h3>
<p>
  修改模板
</p>
<p><img loading="lazy" decoding="async" width="1017" height="546" src="/wp-content/uploads/2018/05/word-image-3484.png" class="wp-image-3939" srcset="/wp-content/uploads/2018/05/word-image-3484.png 1017w, /wp-content/uploads/2018/05/word-image-3484-300x161.png 300w, /wp-content/uploads/2018/05/word-image-3484-768x412.png 768w" sizes="(max-width: 1017px) 100vw, 1017px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="622" height="263" src="/wp-content/uploads/2018/05/word-image-3485.png" class="wp-image-3940" srcset="/wp-content/uploads/2018/05/word-image-3485.png 622w, /wp-content/uploads/2018/05/word-image-3485-300x127.png 300w" sizes="(max-width: 622px) 100vw, 622px" /></p>
<p>
  对于特殊写法使用比较多的就是在模板中使用U函数生成链接地址
</p>
<h2>1.4、模板变量默认值</h2>
<p>
  当模板变量数据为空时输出的内容
</p>
<p>
  ①创建测试方法
</p>
<p><img loading="lazy" decoding="async" width="714" height="384" src="/wp-content/uploads/2018/05/word-image-3486.png" class="wp-image-3941" srcset="/wp-content/uploads/2018/05/word-image-3486.png 714w, /wp-content/uploads/2018/05/word-image-3486-300x161.png 300w" sizes="(max-width: 714px) 100vw, 714px" /></p>
<p>
  ②创建模板
</p>
<p><img loading="lazy" decoding="async" width="684" height="479" src="/wp-content/uploads/2018/05/word-image-3487.png" class="wp-image-3942" srcset="/wp-content/uploads/2018/05/word-image-3487.png 684w, /wp-content/uploads/2018/05/word-image-3487-300x210.png 300w" sizes="(max-width: 684px) 100vw, 684px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="609" height="162" src="/wp-content/uploads/2018/05/word-image-3488.png" class="wp-image-3943" srcset="/wp-content/uploads/2018/05/word-image-3488.png 609w, /wp-content/uploads/2018/05/word-image-3488-300x80.png 300w" sizes="(max-width: 609px) 100vw, 609px" /></p>
<h2>1.5、模板运算</h2>
<p>
  模板运算即直接在模板中进行数据的加减乘除操作
</p>
<h3>1.5.1、基本运算</h3>
<p>
  创建方法
</p>
<p><img loading="lazy" decoding="async" width="774" height="293" src="/wp-content/uploads/2018/05/word-image-3489.png" class="wp-image-3944" srcset="/wp-content/uploads/2018/05/word-image-3489.png 774w, /wp-content/uploads/2018/05/word-image-3489-300x114.png 300w, /wp-content/uploads/2018/05/word-image-3489-768x291.png 768w" sizes="(max-width: 774px) 100vw, 774px" /></p>
<p>
  创建模板
</p>
<p><img loading="lazy" decoding="async" width="848" height="492" src="/wp-content/uploads/2018/05/word-image-3490.png" class="wp-image-3945" srcset="/wp-content/uploads/2018/05/word-image-3490.png 848w, /wp-content/uploads/2018/05/word-image-3490-300x174.png 300w, /wp-content/uploads/2018/05/word-image-3490-768x446.png 768w" sizes="(max-width: 848px) 100vw, 848px" /></p>
<p>
  效果
</p>
<p><img loading="lazy" decoding="async" width="577" height="225" src="/wp-content/uploads/2018/05/word-image-3491.png" class="wp-image-3946" srcset="/wp-content/uploads/2018/05/word-image-3491.png 577w, /wp-content/uploads/2018/05/word-image-3491-300x117.png 300w" sizes="(max-width: 577px) 100vw, 577px" /></p>
<h3>1.5.2、数组的运算</h3>
<p>
  在模板中对数组进行运算不在支持点语法。需要使用PHP原生的方式操作数据
</p>
<ol>
<li>
  创建方法
</li>
</ol>
<p><img loading="lazy" decoding="async" width="1028" height="500" src="/wp-content/uploads/2018/05/word-image-3492.png" class="wp-image-3947" srcset="/wp-content/uploads/2018/05/word-image-3492.png 1028w, /wp-content/uploads/2018/05/word-image-3492-300x146.png 300w, /wp-content/uploads/2018/05/word-image-3492-768x374.png 768w, /wp-content/uploads/2018/05/word-image-3492-1024x498.png 1024w" sizes="(max-width: 1028px) 100vw, 1028px" /></p>
<p>
  ②创建模板d
</p>
<p><img loading="lazy" decoding="async" width="1036" height="466" src="/wp-content/uploads/2018/05/word-image-3493.png" class="wp-image-3948" srcset="/wp-content/uploads/2018/05/word-image-3493.png 1036w, /wp-content/uploads/2018/05/word-image-3493-300x135.png 300w, /wp-content/uploads/2018/05/word-image-3493-768x345.png 768w, /wp-content/uploads/2018/05/word-image-3493-1024x461.png 1024w" sizes="(max-width: 1036px) 100vw, 1036px" /></p>
<p>
  ③效果
</p>
<p><img loading="lazy" decoding="async" width="706" height="196" src="/wp-content/uploads/2018/05/word-image-3494.png" class="wp-image-3949" srcset="/wp-content/uploads/2018/05/word-image-3494.png 706w, /wp-content/uploads/2018/05/word-image-3494-300x83.png 300w" sizes="(max-width: 706px) 100vw, 706px" /></p>
<h2>1.6、内置标签</h2>
<p>
  TP内置的模板引擎中支持很多标签需要重点的volist foreache if
</p>
<p><img loading="lazy" decoding="async" width="629" height="463" src="/wp-content/uploads/2018/05/word-image-3495.png" class="wp-image-3950" srcset="/wp-content/uploads/2018/05/word-image-3495.png 629w, /wp-content/uploads/2018/05/word-image-3495-300x221.png 300w" sizes="(max-width: 629px) 100vw, 629px" /></p>
<h3>1.6.1、关于标签解析的源码位置</h3>
<h3>1.6.2、foreach标签</h3>
<p>
  ①查看使用方式
</p>
<p><img loading="lazy" decoding="async" width="885" height="506" src="/wp-content/uploads/2018/05/word-image-3497.png" class="wp-image-3952" srcset="/wp-content/uploads/2018/05/word-image-3497.png 885w, /wp-content/uploads/2018/05/word-image-3497-300x172.png 300w, /wp-content/uploads/2018/05/word-image-3497-768x439.png 768w" sizes="(max-width: 885px) 100vw, 885px" /></p>
<p>
  ②创建方法
</p>
<p><img loading="lazy" decoding="async" width="1011" height="532" src="/wp-content/uploads/2018/05/word-image-3498.png" class="wp-image-3953" srcset="/wp-content/uploads/2018/05/word-image-3498.png 1011w, /wp-content/uploads/2018/05/word-image-3498-300x158.png 300w, /wp-content/uploads/2018/05/word-image-3498-768x404.png 768w" sizes="(max-width: 1011px) 100vw, 1011px" /></p>
<p>
  ③创建模板
</p>
<p><img loading="lazy" decoding="async" width="800" height="500" src="/wp-content/uploads/2018/05/word-image-3499.png" class="wp-image-3954" srcset="/wp-content/uploads/2018/05/word-image-3499.png 800w, /wp-content/uploads/2018/05/word-image-3499-300x188.png 300w, /wp-content/uploads/2018/05/word-image-3499-768x480.png 768w" sizes="(max-width: 800px) 100vw, 800px" /></p>
<p>
  ④效果如下
</p>
<p><img loading="lazy" decoding="async" width="562" height="151" src="/wp-content/uploads/2018/05/word-image-3500.png" class="wp-image-3955" srcset="/wp-content/uploads/2018/05/word-image-3500.png 562w, /wp-content/uploads/2018/05/word-image-3500-300x81.png 300w" sizes="(max-width: 562px) 100vw, 562px" /></p>
<h3>1.6.3、volist标签</h3>
<p>
  Volist跟foreach功能是一模一样都是为了循环数据。但是volist标签所支持的功能比foreach更加强大。除了循环数据在循环的过程中可以指定长度、偏移量、计数器等
</p>
<p>
  ①查看volist使用方式
</p>
<p><img loading="lazy" decoding="async" width="1013" height="415" src="/wp-content/uploads/2018/05/word-image-3501.png" class="wp-image-3956" srcset="/wp-content/uploads/2018/05/word-image-3501.png 1013w, /wp-content/uploads/2018/05/word-image-3501-300x123.png 300w, /wp-content/uploads/2018/05/word-image-3501-768x315.png 768w" sizes="(max-width: 1013px) 100vw, 1013px" /></p>
<p>
  ②创建测试方法
</p>
<p><img loading="lazy" decoding="async" width="986" height="602" src="/wp-content/uploads/2018/05/word-image-3502.png" class="wp-image-3957" srcset="/wp-content/uploads/2018/05/word-image-3502.png 986w, /wp-content/uploads/2018/05/word-image-3502-300x183.png 300w, /wp-content/uploads/2018/05/word-image-3502-768x469.png 768w" sizes="(max-width: 986px) 100vw, 986px" /></p>
<ol>
<li>
  创建模板
</li>
</ol>
<p>
  n
</p>
<p><img loading="lazy" decoding="async" width="976" height="634" src="/wp-content/uploads/2018/05/word-image-3503.png" class="wp-image-3958" srcset="/wp-content/uploads/2018/05/word-image-3503.png 976w, /wp-content/uploads/2018/05/word-image-3503-300x195.png 300w, /wp-content/uploads/2018/05/word-image-3503-768x499.png 768w" sizes="(max-width: 976px) 100vw, 976px" /><br />
<img loading="lazy" decoding="async" width="999" height="436" src="/wp-content/uploads/2018/05/word-image-3504.png" class="wp-image-3959" srcset="/wp-content/uploads/2018/05/word-image-3504.png 999w, /wp-content/uploads/2018/05/word-image-3504-300x131.png 300w, /wp-content/uploads/2018/05/word-image-3504-768x335.png 768w" sizes="(max-width: 999px) 100vw, 999px" /></p>
<p>
  ③效果如下
</p>
<p><img loading="lazy" decoding="async" width="1080" height="682" src="/wp-content/uploads/2018/05/word-image-3505.png" class="wp-image-3960" srcset="/wp-content/uploads/2018/05/word-image-3505.png 1080w, /wp-content/uploads/2018/05/word-image-3505-300x189.png 300w, /wp-content/uploads/2018/05/word-image-3505-768x485.png 768w, /wp-content/uploads/2018/05/word-image-3505-1024x647.png 1024w" sizes="(max-width: 1080px) 100vw, 1080px" /><br />
<img loading="lazy" decoding="async" width="858" height="234" src="/wp-content/uploads/2018/05/word-image-3506.png" class="wp-image-3961" srcset="/wp-content/uploads/2018/05/word-image-3506.png 858w, /wp-content/uploads/2018/05/word-image-3506-300x82.png 300w, /wp-content/uploads/2018/05/word-image-3506-768x209.png 768w" sizes="(max-width: 858px) 100vw, 858px" /></p>
<h3>1.6.4、if标签</h3>
<p>
  if标签作用进行判断
</p>
<p>
  ①查看使用方式
</p>
<p><img loading="lazy" decoding="async" width="1055" height="344" src="/wp-content/uploads/2018/05/word-image-3507.png" class="wp-image-3962" srcset="/wp-content/uploads/2018/05/word-image-3507.png 1055w, /wp-content/uploads/2018/05/word-image-3507-300x98.png 300w, /wp-content/uploads/2018/05/word-image-3507-768x250.png 768w, /wp-content/uploads/2018/05/word-image-3507-1024x334.png 1024w" sizes="(max-width: 1055px) 100vw, 1055px" /></p>
<p>
  ②创建测试方法
</p>
<p><img loading="lazy" decoding="async" width="810" height="312" src="/wp-content/uploads/2018/05/word-image-3508.png" class="wp-image-3963" srcset="/wp-content/uploads/2018/05/word-image-3508.png 810w, /wp-content/uploads/2018/05/word-image-3508-300x116.png 300w, /wp-content/uploads/2018/05/word-image-3508-768x296.png 768w" sizes="(max-width: 810px) 100vw, 810px" /></p>
<p>
  ③模板编写
</p>
<p><img loading="lazy" decoding="async" width="1085" height="593" src="/wp-content/uploads/2018/05/word-image-3509.png" class="wp-image-3964" srcset="/wp-content/uploads/2018/05/word-image-3509.png 1085w, /wp-content/uploads/2018/05/word-image-3509-300x164.png 300w, /wp-content/uploads/2018/05/word-image-3509-768x420.png 768w, /wp-content/uploads/2018/05/word-image-3509-1024x560.png 1024w" sizes="(max-width: 1085px) 100vw, 1085px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="573" height="151" src="/wp-content/uploads/2018/05/word-image-3510.png" class="wp-image-3965" srcset="/wp-content/uploads/2018/05/word-image-3510.png 573w, /wp-content/uploads/2018/05/word-image-3510-300x79.png 300w" sizes="(max-width: 573px) 100vw, 573px" /></p>
<h1>模型</h1>
<h2>2.1、开启PDO扩展</h2>
<p>
  ①修改php.ini文件
</p>
<p><img loading="lazy" decoding="async" width="954" height="526" src="/wp-content/uploads/2018/05/word-image-3511.png" class="wp-image-3966" srcset="/wp-content/uploads/2018/05/word-image-3511.png 954w, /wp-content/uploads/2018/05/word-image-3511-300x165.png 300w, /wp-content/uploads/2018/05/word-image-3511-768x423.png 768w" sizes="(max-width: 954px) 100vw, 954px" /></p>
<p>
  ②重启Apache查看phpinfo
</p>
<p><img loading="lazy" decoding="async" width="1348" height="474" src="/wp-content/uploads/2018/05/word-image-3512.png" class="wp-image-3967" srcset="/wp-content/uploads/2018/05/word-image-3512.png 1348w, /wp-content/uploads/2018/05/word-image-3512-300x105.png 300w, /wp-content/uploads/2018/05/word-image-3512-768x270.png 768w, /wp-content/uploads/2018/05/word-image-3512-1024x360.png 1024w" sizes="(max-width: 1348px) 100vw, 1348px" /></p>
<h2>2.2、配置数据库的连接</h2>
<p>
  ①创建数据库
</p>
<p><img loading="lazy" decoding="async" width="280" height="291" src="/wp-content/uploads/2018/05/word-image-3513.png" class="wp-image-3968" /></p>
<p>
  ②创建测试数据表
</p>
<p>
  CREATE TABLE `tp_student` (
</p>
<p>
    `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
</p>
<p>
    `sname` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;名称&#8217;,
</p>
<p>
    `sage` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;年纪&#8217;,
</p>
<p>
    `sdept` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;班级&#8217;,
</p>
<p>
    PRIMARY KEY (`id`)
</p>
<p>
  ) ENGINE=InnoDB DEFAULT CHARSET=utf8;
</p>
<p>
  ③修改配置文件
</p>
<p><img loading="lazy" decoding="async" width="1070" height="672" src="/wp-content/uploads/2018/05/word-image-3514.png" class="wp-image-3969" srcset="/wp-content/uploads/2018/05/word-image-3514.png 1070w, /wp-content/uploads/2018/05/word-image-3514-300x188.png 300w, /wp-content/uploads/2018/05/word-image-3514-768x482.png 768w, /wp-content/uploads/2018/05/word-image-3514-1024x643.png 1024w" sizes="(max-width: 1070px) 100vw, 1070px" /></p>
<h2>2.3、创建自定义的模型</h2>
<h3>2.3.1、自定义模型存储规则</h3>
<ol>
<li>
  存储位置：应用/模块/Model
</li>
<li>
  文件名称：模型名称(一般模型名称对应数据表的名称)+Model.class.php
</li>
</ol>
<h3>2.3.2、模型编写规则</h3>
<ol>
<li>
  申明命名空间
</li>
<li>
  引入TP模型基类
</li>
<li>
  编写自定义的模型
</li>
</ol>
<h3>2.3.2、创建自定义模型</h3>
<p><img loading="lazy" decoding="async" width="906" height="560" src="/wp-content/uploads/2018/05/word-image-3515.png" class="wp-image-3970" srcset="/wp-content/uploads/2018/05/word-image-3515.png 906w, /wp-content/uploads/2018/05/word-image-3515-300x185.png 300w, /wp-content/uploads/2018/05/word-image-3515-768x475.png 768w" sizes="(max-width: 906px) 100vw, 906px" /></p>
<h2>2.4、模型实例化</h2>
<h3>2.4.1、模型实例化的三种方式</h3>
<p>
  ①使用new进行实例化
</p>
<p><img loading="lazy" decoding="async" width="996" height="533" src="/wp-content/uploads/2018/05/word-image-3516.png" class="wp-image-3971" srcset="/wp-content/uploads/2018/05/word-image-3516.png 996w, /wp-content/uploads/2018/05/word-image-3516-300x161.png 300w, /wp-content/uploads/2018/05/word-image-3516-768x411.png 768w" sizes="(max-width: 996px) 100vw, 996px" /></p>
<p>
  结果如下
</p>
<p><img loading="lazy" decoding="async" width="869" height="369" src="/wp-content/uploads/2018/05/word-image-3517.png" class="wp-image-3972" srcset="/wp-content/uploads/2018/05/word-image-3517.png 869w, /wp-content/uploads/2018/05/word-image-3517-300x127.png 300w, /wp-content/uploads/2018/05/word-image-3517-768x326.png 768w" sizes="(max-width: 869px) 100vw, 869px" /></p>
<p>
  ②使用M进行实例化
</p>
<p><img loading="lazy" decoding="async" width="965" height="622" src="/wp-content/uploads/2018/05/word-image-3518.png" class="wp-image-3973" srcset="/wp-content/uploads/2018/05/word-image-3518.png 965w, /wp-content/uploads/2018/05/word-image-3518-300x193.png 300w, /wp-content/uploads/2018/05/word-image-3518-768x495.png 768w" sizes="(max-width: 965px) 100vw, 965px" /></p>
<p>
  结果
</p>
<p><img loading="lazy" decoding="async" width="706" height="277" src="/wp-content/uploads/2018/05/word-image-3519.png" class="wp-image-3974" srcset="/wp-content/uploads/2018/05/word-image-3519.png 706w, /wp-content/uploads/2018/05/word-image-3519-300x118.png 300w" sizes="(max-width: 706px) 100vw, 706px" /></p>
<p>
  ③使用D函数实例化
</p>
<p><img loading="lazy" decoding="async" width="878" height="545" src="/wp-content/uploads/2018/05/word-image-3520.png" class="wp-image-3975" srcset="/wp-content/uploads/2018/05/word-image-3520.png 878w, /wp-content/uploads/2018/05/word-image-3520-300x186.png 300w, /wp-content/uploads/2018/05/word-image-3520-768x477.png 768w" sizes="(max-width: 878px) 100vw, 878px" /></p>
<p>
  结果
</p>
<p><img loading="lazy" decoding="async" width="732" height="321" src="/wp-content/uploads/2018/05/word-image-3521.png" class="wp-image-3976" srcset="/wp-content/uploads/2018/05/word-image-3521.png 732w, /wp-content/uploads/2018/05/word-image-3521-300x132.png 300w" sizes="(max-width: 732px) 100vw, 732px" /></p>
<h3>2.4.2、M函数使用</h3>
<p>
  M函数一共有三个参数
</p>
<p>
  第一个：指定具体表的名称
</p>
<p>
  第二个：指定表的前缀
</p>
<p>
  第三个：指定数据库的连接信息
</p>
<p>
  ①演示M实例化特殊名称的表
</p>
<p>
  先复制一个特殊的数据表
</p>
<p><img loading="lazy" decoding="async" width="781" height="163" src="/wp-content/uploads/2018/05/word-image-3522.png" class="wp-image-3977" srcset="/wp-content/uploads/2018/05/word-image-3522.png 781w, /wp-content/uploads/2018/05/word-image-3522-300x63.png 300w, /wp-content/uploads/2018/05/word-image-3522-768x160.png 768w" sizes="(max-width: 781px) 100vw, 781px" /></p>
<p>
  编写代码实例化
</p>
<p><img loading="lazy" decoding="async" width="841" height="359" src="/wp-content/uploads/2018/05/word-image-3523.png" class="wp-image-3978" srcset="/wp-content/uploads/2018/05/word-image-3523.png 841w, /wp-content/uploads/2018/05/word-image-3523-300x128.png 300w, /wp-content/uploads/2018/05/word-image-3523-768x328.png 768w" sizes="(max-width: 841px) 100vw, 841px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="857" height="422" src="/wp-content/uploads/2018/05/word-image-3524.png" class="wp-image-3979" srcset="/wp-content/uploads/2018/05/word-image-3524.png 857w, /wp-content/uploads/2018/05/word-image-3524-300x148.png 300w, /wp-content/uploads/2018/05/word-image-3524-768x378.png 768w" sizes="(max-width: 857px) 100vw, 857px" /></p>
<p>
  ②演示第三个参数的使用方式
</p>
<p>
  先在其他数据库下创建数据表
</p>
<p><img loading="lazy" decoding="async" width="881" height="390" src="/wp-content/uploads/2018/05/word-image-3525.png" class="wp-image-3980" srcset="/wp-content/uploads/2018/05/word-image-3525.png 881w, /wp-content/uploads/2018/05/word-image-3525-300x133.png 300w, /wp-content/uploads/2018/05/word-image-3525-768x340.png 768w" sizes="(max-width: 881px) 100vw, 881px" /></p>
<p>
  编写代码连接Tp5_shop数据库下的student表
</p>
<p><img loading="lazy" decoding="async" width="1048" height="707" src="/wp-content/uploads/2018/05/word-image-3526.png" class="wp-image-3981" srcset="/wp-content/uploads/2018/05/word-image-3526.png 1048w, /wp-content/uploads/2018/05/word-image-3526-300x202.png 300w, /wp-content/uploads/2018/05/word-image-3526-768x518.png 768w, /wp-content/uploads/2018/05/word-image-3526-1024x691.png 1024w" sizes="(max-width: 1048px) 100vw, 1048px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="772" height="590" src="/wp-content/uploads/2018/05/word-image-3527.png" class="wp-image-3982" srcset="/wp-content/uploads/2018/05/word-image-3527.png 772w, /wp-content/uploads/2018/05/word-image-3527-300x229.png 300w, /wp-content/uploads/2018/05/word-image-3527-768x587.png 768w" sizes="(max-width: 772px) 100vw, 772px" /></p>
<p>
  对于M函数的第三个参数可以实现跨数据库服务器、数据库进行操作
</p>
<p>
  ③关于M函数第三个参数的变形写法
</p>
<p>
  首先配置数据库的连接
</p>
<p><img loading="lazy" decoding="async" width="1046" height="604" src="/wp-content/uploads/2018/05/word-image-3528.png" class="wp-image-3983" srcset="/wp-content/uploads/2018/05/word-image-3528.png 1046w, /wp-content/uploads/2018/05/word-image-3528-300x173.png 300w, /wp-content/uploads/2018/05/word-image-3528-768x443.png 768w, /wp-content/uploads/2018/05/word-image-3528-1024x591.png 1024w" sizes="(max-width: 1046px) 100vw, 1046px" /></p>
<p>
  修改方法
</p>
<p><img loading="lazy" decoding="async" width="971" height="511" src="/wp-content/uploads/2018/05/word-image-3529.png" class="wp-image-3984" srcset="/wp-content/uploads/2018/05/word-image-3529.png 971w, /wp-content/uploads/2018/05/word-image-3529-300x158.png 300w, /wp-content/uploads/2018/05/word-image-3529-768x404.png 768w" sizes="(max-width: 971px) 100vw, 971px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="912" height="558" src="/wp-content/uploads/2018/05/word-image-3530.png" class="wp-image-3985" srcset="/wp-content/uploads/2018/05/word-image-3530.png 912w, /wp-content/uploads/2018/05/word-image-3530-300x184.png 300w, /wp-content/uploads/2018/05/word-image-3530-768x470.png 768w" sizes="(max-width: 912px) 100vw, 912px" /></p>
<p>
  总结：M函数实例化模型对象永远是实例化TP模型基类的对象
</p>
<h3>2.4.3、D函数的使用</h3>
<p>
  ①D函数的基本使用
</p>
<p><img loading="lazy" decoding="async" width="810" height="325" src="/wp-content/uploads/2018/05/word-image-3531.png" class="wp-image-3986" srcset="/wp-content/uploads/2018/05/word-image-3531.png 810w, /wp-content/uploads/2018/05/word-image-3531-300x120.png 300w, /wp-content/uploads/2018/05/word-image-3531-768x308.png 768w" sizes="(max-width: 810px) 100vw, 810px" /><br />
<img loading="lazy" decoding="async" width="962" height="542" src="/wp-content/uploads/2018/05/word-image-3532.png" class="wp-image-3987" srcset="/wp-content/uploads/2018/05/word-image-3532.png 962w, /wp-content/uploads/2018/05/word-image-3532-300x169.png 300w, /wp-content/uploads/2018/05/word-image-3532-768x433.png 768w" sizes="(max-width: 962px) 100vw, 962px" /></p>
<p>
  ②实例化一个没有自定义模型的对象
</p>
<p>
  复制一个tp_class数据表
</p>
<p><img loading="lazy" decoding="async" width="900" height="312" src="/wp-content/uploads/2018/05/word-image-3533.png" class="wp-image-3988" srcset="/wp-content/uploads/2018/05/word-image-3533.png 900w, /wp-content/uploads/2018/05/word-image-3533-300x104.png 300w, /wp-content/uploads/2018/05/word-image-3533-768x266.png 768w" sizes="(max-width: 900px) 100vw, 900px" /></p>
<p>
  编写代码
</p>
<p><img loading="lazy" decoding="async" width="947" height="384" src="/wp-content/uploads/2018/05/word-image-3534.png" class="wp-image-3989" srcset="/wp-content/uploads/2018/05/word-image-3534.png 947w, /wp-content/uploads/2018/05/word-image-3534-300x122.png 300w, /wp-content/uploads/2018/05/word-image-3534-768x311.png 768w" sizes="(max-width: 947px) 100vw, 947px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="757" height="436" src="/wp-content/uploads/2018/05/word-image-3535.png" class="wp-image-3990" srcset="/wp-content/uploads/2018/05/word-image-3535.png 757w, /wp-content/uploads/2018/05/word-image-3535-300x173.png 300w" sizes="(max-width: 757px) 100vw, 757px" /></p>
<p>
  总结：D函数会实例化自定义的模型对象。如果自定义的模型对象不存在。实例化TP模型基类的对象。如果数据表不存在报错
</p>
<h3>2.4.4、总结M跟D的区别</h3>
<p>
  M实例化永远是模型基类。实例化一个不存在的数据表对应的对象时也会报错
</p>
<p>
  D优先自定义的模型。如果自定义模型不存在使用模型基类进行实例化如果数据表不存在报错
</p>
<p>
  D有缓存功能。再次实例化相同的模型对象。不会再次实例化
</p>
<h2>2.5、模型的CURD操作</h2>
<p>
  可以通过TP模型基类中所提供的方法进行数据的增删改查
</p>
<p>
  增加：模型对象-&gt;add()
</p>
<p>
  删除：模型对象-&gt;delete()
</p>
<p>
  修改：模型对象-&gt;save()
</p>
<p>
  查询：模型对象-&gt;find/select()
</p>
<h3>2.5.1、数据增加</h3>
<p>
  ①创建测试
</p>
<p><img loading="lazy" decoding="async" width="999" height="667" src="/wp-content/uploads/2018/05/word-image-3536.png" class="wp-image-3991" srcset="/wp-content/uploads/2018/05/word-image-3536.png 999w, /wp-content/uploads/2018/05/word-image-3536-300x200.png 300w, /wp-content/uploads/2018/05/word-image-3536-768x513.png 768w" sizes="(max-width: 999px) 100vw, 999px" /></p>
<p>
  ②访问测试
</p>
<p><img loading="lazy" decoding="async" width="1031" height="235" src="/wp-content/uploads/2018/05/word-image-3537.png" class="wp-image-3992" srcset="/wp-content/uploads/2018/05/word-image-3537.png 1031w, /wp-content/uploads/2018/05/word-image-3537-300x68.png 300w, /wp-content/uploads/2018/05/word-image-3537-768x175.png 768w, /wp-content/uploads/2018/05/word-image-3537-1024x233.png 1024w" sizes="(max-width: 1031px) 100vw, 1031px" /></p>
<p>
  ③查看数据库
</p>
<p><img loading="lazy" decoding="async" width="409" height="123" src="/wp-content/uploads/2018/05/word-image-3538.png" class="wp-image-3993" srcset="/wp-content/uploads/2018/05/word-image-3538.png 409w, /wp-content/uploads/2018/05/word-image-3538-300x90.png 300w" sizes="(max-width: 409px) 100vw, 409px" /></p>
<h3>2.5.2、数据的批量写入</h3>
<p>
  数据批量写入可以使用addAll方法实现。写入数据时需要注意。数据的下标必须从0,1,2,3顺序下来。最后的返回结果为写入数据第一条的主键标识
</p>
<p><img loading="lazy" decoding="async" width="1006" height="641" src="/wp-content/uploads/2018/05/word-image-3539.png" class="wp-image-3994" srcset="/wp-content/uploads/2018/05/word-image-3539.png 1006w, /wp-content/uploads/2018/05/word-image-3539-300x191.png 300w, /wp-content/uploads/2018/05/word-image-3539-768x489.png 768w" sizes="(max-width: 1006px) 100vw, 1006px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="528" height="139" src="/wp-content/uploads/2018/05/word-image-3540.png" class="wp-image-3995" srcset="/wp-content/uploads/2018/05/word-image-3540.png 528w, /wp-content/uploads/2018/05/word-image-3540-300x79.png 300w" sizes="(max-width: 528px) 100vw, 528px" /></p>
<h3>2.5.3、数据修改</h3>
<p><img loading="lazy" decoding="async" width="1053" height="699" src="/wp-content/uploads/2018/05/word-image-3541.png" class="wp-image-3996" srcset="/wp-content/uploads/2018/05/word-image-3541.png 1053w, /wp-content/uploads/2018/05/word-image-3541-300x199.png 300w, /wp-content/uploads/2018/05/word-image-3541-768x510.png 768w, /wp-content/uploads/2018/05/word-image-3541-1024x680.png 1024w" sizes="(max-width: 1053px) 100vw, 1053px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="827" height="284" src="/wp-content/uploads/2018/05/word-image-3542.png" class="wp-image-3997" srcset="/wp-content/uploads/2018/05/word-image-3542.png 827w, /wp-content/uploads/2018/05/word-image-3542-300x103.png 300w, /wp-content/uploads/2018/05/word-image-3542-768x264.png 768w" sizes="(max-width: 827px) 100vw, 827px" /></p>
<h3>2.5.4、数据查询</h3>
<p>
  Find：查询获取一条数据。结果为一维数组
</p>
<p>
  Select：查询获取多条数据。结果为二维数组
</p>
<p><img loading="lazy" decoding="async" width="907" height="395" src="/wp-content/uploads/2018/05/word-image-3543.png" class="wp-image-3998" srcset="/wp-content/uploads/2018/05/word-image-3543.png 907w, /wp-content/uploads/2018/05/word-image-3543-300x131.png 300w, /wp-content/uploads/2018/05/word-image-3543-768x334.png 768w" sizes="(max-width: 907px) 100vw, 907px" /></p>
<p>
  结果如下
</p>
<p><img loading="lazy" decoding="async" width="961" height="500" src="/wp-content/uploads/2018/05/word-image-3544.png" class="wp-image-3999" srcset="/wp-content/uploads/2018/05/word-image-3544.png 961w, /wp-content/uploads/2018/05/word-image-3544-300x156.png 300w, /wp-content/uploads/2018/05/word-image-3544-768x400.png 768w" sizes="(max-width: 961px) 100vw, 961px" /></p>
<h3>2.5.5、数据删除</h3>
<p><img loading="lazy" decoding="async" width="960" height="504" src="/wp-content/uploads/2018/05/word-image-3545.png" class="wp-image-4000" srcset="/wp-content/uploads/2018/05/word-image-3545.png 960w, /wp-content/uploads/2018/05/word-image-3545-300x158.png 300w, /wp-content/uploads/2018/05/word-image-3545-768x403.png 768w" sizes="(max-width: 960px) 100vw, 960px" /><br />
<img loading="lazy" decoding="async" width="745" height="233" src="/wp-content/uploads/2018/05/word-image-3546.png" class="wp-image-4001" srcset="/wp-content/uploads/2018/05/word-image-3546.png 745w, /wp-content/uploads/2018/05/word-image-3546-300x94.png 300w" sizes="(max-width: 745px) 100vw, 745px" /></p>
<h1>电商案例-分类的添加</h1>
<h2>3.1、实现步骤</h2>
<ol>
<li>
  显示添加表单模板
</li>
<li>
  创建数据表
</li>
<li>
  接受表单的提交数据
</li>
<li>
  接受之后写入数据库
</li>
</ol>
<h2>3.2、显示商品的添加模板</h2>
<p>
  ①创建控制器方法显示模板
</p>
<p><img loading="lazy" decoding="async" width="923" height="407" src="/wp-content/uploads/2018/05/word-image-3547.png" class="wp-image-4002" srcset="/wp-content/uploads/2018/05/word-image-3547.png 923w, /wp-content/uploads/2018/05/word-image-3547-300x132.png 300w, /wp-content/uploads/2018/05/word-image-3547-768x339.png 768w" sizes="(max-width: 923px) 100vw, 923px" /></p>
<p>
  ②拷贝添加的模板
</p>
<p><img loading="lazy" decoding="async" width="1144" height="553" src="/wp-content/uploads/2018/05/word-image-3548.png" class="wp-image-4003" srcset="/wp-content/uploads/2018/05/word-image-3548.png 1144w, /wp-content/uploads/2018/05/word-image-3548-300x145.png 300w, /wp-content/uploads/2018/05/word-image-3548-768x371.png 768w, /wp-content/uploads/2018/05/word-image-3548-1024x495.png 1024w" sizes="(max-width: 1144px) 100vw, 1144px" /></p>
<p>
  ③修改资源地址
</p>
<p><img loading="lazy" decoding="async" width="1047" height="476" src="/wp-content/uploads/2018/05/word-image-3549.png" class="wp-image-4004" srcset="/wp-content/uploads/2018/05/word-image-3549.png 1047w, /wp-content/uploads/2018/05/word-image-3549-300x136.png 300w, /wp-content/uploads/2018/05/word-image-3549-768x349.png 768w, /wp-content/uploads/2018/05/word-image-3549-1024x466.png 1024w" sizes="(max-width: 1047px) 100vw, 1047px" /></p>
<h2>3.3、创建数据表</h2>
<p>
  ①创建数据库
</p>
<p><img loading="lazy" decoding="async" width="757" height="394" src="/wp-content/uploads/2018/05/word-image-3550.png" class="wp-image-4005" srcset="/wp-content/uploads/2018/05/word-image-3550.png 757w, /wp-content/uploads/2018/05/word-image-3550-300x156.png 300w" sizes="(max-width: 757px) 100vw, 757px" /></p>
<p>
  ②创建分类的数据表
</p>
<p>
  CREATE TABLE `shop_category` (
</p>
<p>
    `id` smallint(5) unsigned NOT NULL AUTO_INCREMENT,
</p>
<p>
    `cname` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;分类名称&#8217;,
</p>
<p>
    `parent_id` smallint(6) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;父分类的ID 0表示顶级&#8217;,
</p>
<p>
    PRIMARY KEY (`id`)
</p>
<p>
  ) ENGINE=InnoDB DEFAULT CHARSET=utf8;
</p>
<h2>3.4、接受表单的提交数据</h2>
<p>
  ①修改表单提交的地址
</p>
<p><img loading="lazy" decoding="async" width="1056" height="650" src="/wp-content/uploads/2018/05/word-image-3551.png" class="wp-image-4006" srcset="/wp-content/uploads/2018/05/word-image-3551.png 1056w, /wp-content/uploads/2018/05/word-image-3551-300x185.png 300w, /wp-content/uploads/2018/05/word-image-3551-768x473.png 768w, /wp-content/uploads/2018/05/word-image-3551-1024x630.png 1024w" sizes="(max-width: 1056px) 100vw, 1056px" /></p>
<p>
  ②创建方法
</p>
<p><img loading="lazy" decoding="async" width="690" height="417" src="/wp-content/uploads/2018/05/word-image-3552.png" class="wp-image-4007" srcset="/wp-content/uploads/2018/05/word-image-3552.png 690w, /wp-content/uploads/2018/05/word-image-3552-300x181.png 300w" sizes="(max-width: 690px) 100vw, 690px" /></p>
<p>
  ③测试数据提交
</p>
<p><img loading="lazy" decoding="async" width="563" height="190" src="/wp-content/uploads/2018/05/word-image-3553.png" class="wp-image-4008" srcset="/wp-content/uploads/2018/05/word-image-3553.png 563w, /wp-content/uploads/2018/05/word-image-3553-300x101.png 300w" sizes="(max-width: 563px) 100vw, 563px" /></p>
<h2>3.5、实现数据入库</h2>
<p>
  ①配置数据库的连接
</p>
<p><img loading="lazy" decoding="async" width="1022" height="492" src="/wp-content/uploads/2018/05/word-image-3554.png" class="wp-image-4009" srcset="/wp-content/uploads/2018/05/word-image-3554.png 1022w, /wp-content/uploads/2018/05/word-image-3554-300x144.png 300w, /wp-content/uploads/2018/05/word-image-3554-768x370.png 768w" sizes="(max-width: 1022px) 100vw, 1022px" /></p>
<p>
  ②自定义模型
</p>
<p><img loading="lazy" decoding="async" width="902" height="533" src="/wp-content/uploads/2018/05/word-image-3555.png" class="wp-image-4010" srcset="/wp-content/uploads/2018/05/word-image-3555.png 902w, /wp-content/uploads/2018/05/word-image-3555-300x177.png 300w, /wp-content/uploads/2018/05/word-image-3555-768x454.png 768w" sizes="(max-width: 902px) 100vw, 902px" /></p>
<p>
  ③实现数据入库
</p>
<p><img loading="lazy" decoding="async" width="894" height="624" src="/wp-content/uploads/2018/05/word-image-3556.png" class="wp-image-4011" srcset="/wp-content/uploads/2018/05/word-image-3556.png 894w, /wp-content/uploads/2018/05/word-image-3556-300x209.png 300w, /wp-content/uploads/2018/05/word-image-3556-768x536.png 768w" sizes="(max-width: 894px) 100vw, 894px" /></p>
<h2>3.6、实现显示表单与数据提交一个方法实现</h2>
<p>
  实现此功能的关键点就是需要判断出当前的请求方式
</p>
<p>
  ①查看手册中的常量
</p>
<p><img loading="lazy" decoding="async" width="1023" height="473" src="/wp-content/uploads/2018/05/word-image-3557.png" class="wp-image-4012" srcset="/wp-content/uploads/2018/05/word-image-3557.png 1023w, /wp-content/uploads/2018/05/word-image-3557-300x139.png 300w, /wp-content/uploads/2018/05/word-image-3557-768x355.png 768w" sizes="(max-width: 1023px) 100vw, 1023px" /></p>
<p>
  ②修改add方法
</p>
<p><img loading="lazy" decoding="async" width="1065" height="701" src="/wp-content/uploads/2018/05/word-image-3558.png" class="wp-image-4013" srcset="/wp-content/uploads/2018/05/word-image-3558.png 1065w, /wp-content/uploads/2018/05/word-image-3558-300x197.png 300w, /wp-content/uploads/2018/05/word-image-3558-768x506.png 768w, /wp-content/uploads/2018/05/word-image-3558-1024x674.png 1024w" sizes="(max-width: 1065px) 100vw, 1065px" /></p>
<p>
  ③修改表单的提交地址
</p>
<p><img loading="lazy" decoding="async" width="1048" height="534" src="/wp-content/uploads/2018/05/word-image-3559.png" class="wp-image-4014" srcset="/wp-content/uploads/2018/05/word-image-3559.png 1048w, /wp-content/uploads/2018/05/word-image-3559-300x153.png 300w, /wp-content/uploads/2018/05/word-image-3559-768x391.png 768w, /wp-content/uploads/2018/05/word-image-3559-1024x522.png 1024w" sizes="(max-width: 1048px) 100vw, 1048px" /></p>
<h2>3.7、过滤参数</h2>
<p>
  ①查看I函数使用方式
</p>
<p><img loading="lazy" decoding="async" width="824" height="532" src="/wp-content/uploads/2018/05/word-image-3560.png" class="wp-image-4015" srcset="/wp-content/uploads/2018/05/word-image-3560.png 824w, /wp-content/uploads/2018/05/word-image-3560-300x194.png 300w, /wp-content/uploads/2018/05/word-image-3560-768x496.png 768w" sizes="(max-width: 824px) 100vw, 824px" /></p>
<p>
  ②修改add方法对数据进行过滤
</p>
<p><img loading="lazy" decoding="async" width="1094" height="663" src="/wp-content/uploads/2018/05/word-image-3561.png" class="wp-image-4016" srcset="/wp-content/uploads/2018/05/word-image-3561.png 1094w, /wp-content/uploads/2018/05/word-image-3561-300x182.png 300w, /wp-content/uploads/2018/05/word-image-3561-768x465.png 768w, /wp-content/uploads/2018/05/word-image-3561-1024x621.png 1024w" sizes="(max-width: 1094px) 100vw, 1094px" /></p>
<h2>3.8、实现可以添加子分类</h2>
<p>
  ①修改add能够获取已有的分类信息
</p>
<p><img loading="lazy" decoding="async" width="1065" height="558" src="/wp-content/uploads/2018/05/word-image-3562.png" class="wp-image-4017" srcset="/wp-content/uploads/2018/05/word-image-3562.png 1065w, /wp-content/uploads/2018/05/word-image-3562-300x157.png 300w, /wp-content/uploads/2018/05/word-image-3562-768x402.png 768w, /wp-content/uploads/2018/05/word-image-3562-1024x537.png 1024w" sizes="(max-width: 1065px) 100vw, 1065px" /></p>
<p>
  ②创建模型方法实现获取数据
</p>
<p><img loading="lazy" decoding="async" width="962" height="607" src="/wp-content/uploads/2018/05/word-image-3563.png" class="wp-image-4018" srcset="/wp-content/uploads/2018/05/word-image-3563.png 962w, /wp-content/uploads/2018/05/word-image-3563-300x189.png 300w, /wp-content/uploads/2018/05/word-image-3563-768x485.png 768w" sizes="(max-width: 962px) 100vw, 962px" /></p>
<p>
  ③增加公共函数
</p>
<p><img loading="lazy" decoding="async" width="952" height="595" src="/wp-content/uploads/2018/05/word-image-3564.png" class="wp-image-4019" srcset="/wp-content/uploads/2018/05/word-image-3564.png 952w, /wp-content/uploads/2018/05/word-image-3564-300x188.png 300w, /wp-content/uploads/2018/05/word-image-3564-768x480.png 768w" sizes="(max-width: 952px) 100vw, 952px" /></p>
<p>
  ④修改模板显示数据
</p>
<p><img loading="lazy" decoding="async" width="1022" height="549" src="/wp-content/uploads/2018/05/word-image-3565.png" class="wp-image-4020" srcset="/wp-content/uploads/2018/05/word-image-3565.png 1022w, /wp-content/uploads/2018/05/word-image-3565-300x161.png 300w, /wp-content/uploads/2018/05/word-image-3565-768x413.png 768w" sizes="(max-width: 1022px) 100vw, 1022px" /></p>
]]></content:encoded>
					
					<wfw:commentRss>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/3905.html/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>TP 3.2 （三）字段缓存、自动验证、字段映射、连贯操作、Trace 工具</title>
		<link>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/3815.html</link>
					<comments>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/3815.html#respond</comments>
		
		<dc:creator><![CDATA[Mr.Lee]]></dc:creator>
		<pubDate>Sat, 19 May 2018 13:06:34 +0000</pubDate>
				<category><![CDATA[TP3.2]]></category>
		<category><![CDATA[后台框架]]></category>
		<category><![CDATA[Trace 工具]]></category>
		<category><![CDATA[字段映射]]></category>
		<category><![CDATA[字段缓存]]></category>
		<category><![CDATA[自动验证]]></category>
		<category><![CDATA[连贯操作]]></category>
		<guid isPermaLink="false">/?p=3815</guid>

					<description><![CDATA[TP中的模型(二) 1.1、字段缓存 1.1.1、思考问题一 当使用save方法进行修改数据时。需要在传递的修 [&#8230;]]]></description>
										<content:encoded><![CDATA[<h1>TP中的模型(二)</h1>
<h2>1.1、字段缓存</h2>
<h3>1.1.1、思考问题一</h3>
<p>
  当使用save方法进行修改数据时。需要在传递的修改数据中增加主键才能正常的修改数据。为什么加上主键TP就知道了条件呢？原因是因为TP会自动的分析数据表结构
</p>
<p>
  ①创建测试方法
</p>
<p><img loading="lazy" decoding="async" width="852" height="410" src="/wp-content/uploads/2018/05/word-image-3363.png" class="wp-image-3816" srcset="/wp-content/uploads/2018/05/word-image-3363.png 852w, /wp-content/uploads/2018/05/word-image-3363-300x144.png 300w, /wp-content/uploads/2018/05/word-image-3363-768x370.png 768w" sizes="(max-width: 852px) 100vw, 852px" /></p>
<p>
  ②结果如下
</p>
<p><img loading="lazy" decoding="async" width="746" height="255" src="/wp-content/uploads/2018/05/word-image-3364.png" class="wp-image-3817" srcset="/wp-content/uploads/2018/05/word-image-3364.png 746w, /wp-content/uploads/2018/05/word-image-3364-300x103.png 300w" sizes="(max-width: 746px) 100vw, 746px" /></p>
<h3>1.1.2、思考问题二</h3>
<p>
  从目前所知当每次实例化模型对象时TP会自动的分析表结构(查询数据)。如果当前业务中有多次实例化操作，并且当前方法访问的比较多。那么就对项目的性能产生影响
</p>
<h3>1.1.3、字段缓存</h3>
<p>
  当每次实例化对象时TP不会再去分析表结构。而是直接去读取”缓存”(读文件)中的内容
</p>
<p>
  ①开启TP的字段缓存功能
</p>
<p><img loading="lazy" decoding="async" width="1081" height="388" src="/wp-content/uploads/2018/05/word-image-3365.png" class="wp-image-3818" srcset="/wp-content/uploads/2018/05/word-image-3365.png 1081w, /wp-content/uploads/2018/05/word-image-3365-300x108.png 300w, /wp-content/uploads/2018/05/word-image-3365-768x276.png 768w, /wp-content/uploads/2018/05/word-image-3365-1024x368.png 1024w" sizes="(max-width: 1081px) 100vw, 1081px" /></p>
<p>
  ②查看第一次效果
</p>
<p><img loading="lazy" decoding="async" width="743" height="225" src="/wp-content/uploads/2018/05/word-image-3366.png" class="wp-image-3819" srcset="/wp-content/uploads/2018/05/word-image-3366.png 743w, /wp-content/uploads/2018/05/word-image-3366-300x91.png 300w" sizes="(max-width: 743px) 100vw, 743px" /></p>
<p>
  ③第二次效果
</p>
<p><img loading="lazy" decoding="async" width="809" height="175" src="/wp-content/uploads/2018/05/word-image-3367.png" class="wp-image-3820" srcset="/wp-content/uploads/2018/05/word-image-3367.png 809w, /wp-content/uploads/2018/05/word-image-3367-300x65.png 300w, /wp-content/uploads/2018/05/word-image-3367-768x166.png 768w" sizes="(max-width: 809px) 100vw, 809px" /></p>
<p>
  ④查看缓存文件
</p>
<p><img loading="lazy" decoding="async" width="1295" height="215" src="/wp-content/uploads/2018/05/word-image-3368.png" class="wp-image-3821" srcset="/wp-content/uploads/2018/05/word-image-3368.png 1295w, /wp-content/uploads/2018/05/word-image-3368-300x50.png 300w, /wp-content/uploads/2018/05/word-image-3368-768x128.png 768w, /wp-content/uploads/2018/05/word-image-3368-1024x170.png 1024w" sizes="(max-width: 1295px) 100vw, 1295px" /></p>
<p>
  解释：当开启字段缓存功能时。第一次实例化模型对象需要去读取数据表的结构信息。但是目前文件不存在，先读取数据库然后将结果写入到文件中。当第二次实例化对象时由于文件已经存在直接读取即可
</p>
<p>
  更新缓存
</p>
<p>
  注意：在调试模式下虽然有对应的字段缓存的文件存在。但是也不会使用
</p>
<h2>1.2、字段定义</h2>
<p>
  对于字段缓存功能将信息存在文件中。文件读取受到磁盘的IO性能影响。磁盘相对于内存效率明显低。为了效率可以将数据表的结果信息保存到变量中(内存)。TP提供了一个变量$fileds容许定义数据表的结构信息。Tp会自动的载入该变量
</p>
<h3>1.2.1、实现字段定义</h3>
<p>
  ①定义字段信息
</p>
<p><img loading="lazy" decoding="async" width="675" height="571" src="/wp-content/uploads/2018/05/word-image-3369.png" class="wp-image-3822" srcset="/wp-content/uploads/2018/05/word-image-3369.png 675w, /wp-content/uploads/2018/05/word-image-3369-300x254.png 300w" sizes="(max-width: 675px) 100vw, 675px" /></p>
<p>
  ②创建测试方法
</p>
<p><img loading="lazy" decoding="async" width="809" height="323" src="/wp-content/uploads/2018/05/word-image-3370.png" class="wp-image-3823" srcset="/wp-content/uploads/2018/05/word-image-3370.png 809w, /wp-content/uploads/2018/05/word-image-3370-300x120.png 300w, /wp-content/uploads/2018/05/word-image-3370-768x307.png 768w" sizes="(max-width: 809px) 100vw, 809px" /></p>
<p>
  ③结果
</p>
<p><img loading="lazy" decoding="async" width="933" height="452" src="/wp-content/uploads/2018/05/word-image-3371.png" class="wp-image-3824" srcset="/wp-content/uploads/2018/05/word-image-3371.png 933w, /wp-content/uploads/2018/05/word-image-3371-300x145.png 300w, /wp-content/uploads/2018/05/word-image-3371-768x372.png 768w" sizes="(max-width: 933px) 100vw, 933px" /></p>
<h3>1.2.2、案例数据写入</h3>
<p>
  ①创建方法
</p>
<p><img loading="lazy" decoding="async" width="873" height="374" src="/wp-content/uploads/2018/05/word-image-3372.png" class="wp-image-3825" srcset="/wp-content/uploads/2018/05/word-image-3372.png 873w, /wp-content/uploads/2018/05/word-image-3372-300x129.png 300w, /wp-content/uploads/2018/05/word-image-3372-768x329.png 768w" sizes="(max-width: 873px) 100vw, 873px" /></p>
<p>
  ②访问测试
</p>
<p><img loading="lazy" decoding="async" width="966" height="219" src="/wp-content/uploads/2018/05/word-image-3373.png" class="wp-image-3826" srcset="/wp-content/uploads/2018/05/word-image-3373.png 966w, /wp-content/uploads/2018/05/word-image-3373-300x68.png 300w, /wp-content/uploads/2018/05/word-image-3373-768x174.png 768w" sizes="(max-width: 966px) 100vw, 966px" /></p>
<p>
  ③修改表结构
</p>
<p><img loading="lazy" decoding="async" width="780" height="189" src="/wp-content/uploads/2018/05/word-image-3374.png" class="wp-image-3827" srcset="/wp-content/uploads/2018/05/word-image-3374.png 780w, /wp-content/uploads/2018/05/word-image-3374-300x73.png 300w, /wp-content/uploads/2018/05/word-image-3374-768x186.png 768w" sizes="(max-width: 780px) 100vw, 780px" /></p>
<p>
  ④再次写入数据
</p>
<p><img loading="lazy" decoding="async" width="800" height="195" src="/wp-content/uploads/2018/05/word-image-3375.png" class="wp-image-3828" srcset="/wp-content/uploads/2018/05/word-image-3375.png 800w, /wp-content/uploads/2018/05/word-image-3375-300x73.png 300w, /wp-content/uploads/2018/05/word-image-3375-768x187.png 768w" sizes="(max-width: 800px) 100vw, 800px" /></p>
<p>
  结果如下
</p>
<p><img loading="lazy" decoding="async" width="957" height="646" src="/wp-content/uploads/2018/05/word-image-3376.png" class="wp-image-3829" srcset="/wp-content/uploads/2018/05/word-image-3376.png 957w, /wp-content/uploads/2018/05/word-image-3376-300x203.png 300w, /wp-content/uploads/2018/05/word-image-3376-768x518.png 768w, /wp-content/uploads/2018/05/word-image-3376-220x150.png 220w" sizes="(max-width: 957px) 100vw, 957px" /></p>
<p>
  对于上述问题的原因是因为修改了数据表结构。但是在属性中的自定义的字段信息没有变化。没有修改导致数据永远不能正常操作到。
</p>
<p>
  注意：修改表结构之后一定要修改字段信息
</p>
<p>
  ⑤修改属性
</p>
<p><img loading="lazy" decoding="async" width="1058" height="587" src="/wp-content/uploads/2018/05/word-image-3377.png" class="wp-image-3830" srcset="/wp-content/uploads/2018/05/word-image-3377.png 1058w, /wp-content/uploads/2018/05/word-image-3377-300x166.png 300w, /wp-content/uploads/2018/05/word-image-3377-768x426.png 768w, /wp-content/uploads/2018/05/word-image-3377-1024x568.png 1024w" sizes="(max-width: 1058px) 100vw, 1058px" /></p>
<p>
  结果如下
</p>
<p><img loading="lazy" decoding="async" width="872" height="177" src="/wp-content/uploads/2018/05/word-image-3378.png" class="wp-image-3831" srcset="/wp-content/uploads/2018/05/word-image-3378.png 872w, /wp-content/uploads/2018/05/word-image-3378-300x61.png 300w, /wp-content/uploads/2018/05/word-image-3378-768x156.png 768w" sizes="(max-width: 872px) 100vw, 872px" /></p>
<p>
  注意：字段缓存不论怎么实例化只要开启都会使用。字段定义只针对使用D实例化方式
</p>
<h2>1.3、数据创建</h2>
<p>
  当进行数据提交入库时需要每一个要入库的字段需要逐个接受。对于此方式操作特别麻烦。此时可以使用模型提供的数据创建功能方便接受数据并且对数据进行安全的验证
</p>
<p>
  ①创建表单
</p>
<p><img loading="lazy" decoding="async" width="951" height="599" src="/wp-content/uploads/2018/05/word-image-3379.png" class="wp-image-3832" srcset="/wp-content/uploads/2018/05/word-image-3379.png 951w, /wp-content/uploads/2018/05/word-image-3379-300x189.png 300w, /wp-content/uploads/2018/05/word-image-3379-768x484.png 768w" sizes="(max-width: 951px) 100vw, 951px" /></p>
<p>
  ②创建方法
</p>
<p><img loading="lazy" decoding="async" width="864" height="487" src="/wp-content/uploads/2018/05/word-image-3380.png" class="wp-image-3833" srcset="/wp-content/uploads/2018/05/word-image-3380.png 864w, /wp-content/uploads/2018/05/word-image-3380-300x169.png 300w, /wp-content/uploads/2018/05/word-image-3380-768x433.png 768w" sizes="(max-width: 864px) 100vw, 864px" /></p>
<p>
  结果可以正常接受但是麻烦并且缺少安全验证
</p>
<p><img loading="lazy" decoding="async" width="617" height="266" src="/wp-content/uploads/2018/05/word-image-3381.png" class="wp-image-3834" srcset="/wp-content/uploads/2018/05/word-image-3381.png 617w, /wp-content/uploads/2018/05/word-image-3381-300x129.png 300w" sizes="(max-width: 617px) 100vw, 617px" /></p>
<p>
  ③使用数据创建
</p>
<p><img loading="lazy" decoding="async" width="1099" height="648" src="/wp-content/uploads/2018/05/word-image-3382.png" class="wp-image-3835" srcset="/wp-content/uploads/2018/05/word-image-3382.png 1099w, /wp-content/uploads/2018/05/word-image-3382-300x177.png 300w, /wp-content/uploads/2018/05/word-image-3382-768x453.png 768w, /wp-content/uploads/2018/05/word-image-3382-1024x604.png 1024w" sizes="(max-width: 1099px) 100vw, 1099px" /></p>
<p>
  ④查看结果
</p>
<p>
  修改前台的html
</p>
<p><img loading="lazy" decoding="async" width="1007" height="569" src="/wp-content/uploads/2018/05/word-image-3383.png" class="wp-image-3836" srcset="/wp-content/uploads/2018/05/word-image-3383.png 1007w, /wp-content/uploads/2018/05/word-image-3383-300x170.png 300w, /wp-content/uploads/2018/05/word-image-3383-768x434.png 768w" sizes="(max-width: 1007px) 100vw, 1007px" /></p>
<p>
  结果如下
</p>
<p><img loading="lazy" decoding="async" width="605" height="208" src="/wp-content/uploads/2018/05/word-image-3384.png" class="wp-image-3837" srcset="/wp-content/uploads/2018/05/word-image-3384.png 605w, /wp-content/uploads/2018/05/word-image-3384-300x103.png 300w" sizes="(max-width: 605px) 100vw, 605px" /></p>
<p>
  对于使用create数据创建默认情况下只能处理post表单提交的数据。如果表单提交为GET默认就不支持
</p>
<h2>1.4、自动验证(重点)</h2>
<p>
  就目前使用create方法能够简单的验证数据(通过根据数据表的字段信息过滤无用的字段)。但是还不能满足要求。需要针对每一个字段的格式都进行验证。
</p>
<ol>
<li>
  可以使用最原始的方式的逐个校验
</li>
<li>
  使用TP所提供的自动验证功能
</li>
</ol>
<h3>1.4.1、验证方式</h3>
<p><img loading="lazy" decoding="async" width="881" height="355" src="/wp-content/uploads/2018/05/word-image-3385.png" class="wp-image-3838" srcset="/wp-content/uploads/2018/05/word-image-3385.png 881w, /wp-content/uploads/2018/05/word-image-3385-300x121.png 300w, /wp-content/uploads/2018/05/word-image-3385-768x309.png 768w" sizes="(max-width: 881px) 100vw, 881px" /></p>
<p>
  TP所提供的自动验证方式有两种：分别为静态方式跟动态方式。对于两种方式都需要编写验证规则
</p>
<h3>1.4.2、验证规则</h3>
<p><img loading="lazy" decoding="async" width="1033" height="252" src="/wp-content/uploads/2018/05/word-image-3386.png" class="wp-image-3839" srcset="/wp-content/uploads/2018/05/word-image-3386.png 1033w, /wp-content/uploads/2018/05/word-image-3386-300x73.png 300w, /wp-content/uploads/2018/05/word-image-3386-768x187.png 768w, /wp-content/uploads/2018/05/word-image-3386-1024x250.png 1024w" sizes="(max-width: 1033px) 100vw, 1033px" /></p>
<p><strong>验证字段</strong>：需要进行验证的字段名称(对应数据表中的字段)。对于其他特殊（数据表中无字段但是需要验证）的可以使用表单名称
</p>
<p><strong>验证规则</strong>：与附加规则配合使用。附加规则指定一个大的验证方式。验证规则在附加规则的基础上在指定更为精确的验证规则。
</p>
<p>
  如果附加规则为regex验证规则就需要写上具体的正则表达式
</p>
<p>
  如果附加规则为function验证规则就需要写上公共函数名称
</p>
<p>
  如果附加规则为callback验证规则就需要写上当前模型下的方法
</p>
<p><strong>错误提示</strong>：当验证不通过提示个用户的信息
</p>
<p><strong>验证条件：</strong>设置用户的提交的内容存在与否  是否进行判断
</p>
<p><img loading="lazy" decoding="async" width="635" height="193" src="/wp-content/uploads/2018/05/word-image-3387.png" class="wp-image-3840" srcset="/wp-content/uploads/2018/05/word-image-3387.png 635w, /wp-content/uploads/2018/05/word-image-3387-300x91.png 300w" sizes="(max-width: 635px) 100vw, 635px" /></p>
<p><strong>附加规则：</strong>指定验证使用哪一种方式进行验证
</p>
<p><img loading="lazy" decoding="async" width="1018" height="582" src="/wp-content/uploads/2018/05/word-image-3388.png" class="wp-image-3841" srcset="/wp-content/uploads/2018/05/word-image-3388.png 1018w, /wp-content/uploads/2018/05/word-image-3388-300x172.png 300w, /wp-content/uploads/2018/05/word-image-3388-768x439.png 768w" sizes="(max-width: 1018px) 100vw, 1018px" /></p>
<p><strong>验证时间：</strong>指定什么时间进行验证
</p>
<p><img loading="lazy" decoding="async" width="813" height="267" src="/wp-content/uploads/2018/05/word-image-3389.png" class="wp-image-3842" srcset="/wp-content/uploads/2018/05/word-image-3389.png 813w, /wp-content/uploads/2018/05/word-image-3389-300x99.png 300w, /wp-content/uploads/2018/05/word-image-3389-768x252.png 768w" sizes="(max-width: 813px) 100vw, 813px" /></p>
<p>
  关于验证规则在第一维下。每一个元素就是一条验证规则。如果针对一个内容需要有多个验证规则可以写多条
</p>
<h3>1.4.3、静态方式进行验证-正则</h3>
<p>
  ①创建验证规则
</p>
<p><img loading="lazy" decoding="async" width="1069" height="601" src="/wp-content/uploads/2018/05/word-image-3390.png" class="wp-image-3843" srcset="/wp-content/uploads/2018/05/word-image-3390.png 1069w, /wp-content/uploads/2018/05/word-image-3390-300x169.png 300w, /wp-content/uploads/2018/05/word-image-3390-768x432.png 768w, /wp-content/uploads/2018/05/word-image-3390-1024x576.png 1024w" sizes="(max-width: 1069px) 100vw, 1069px" /></p>
<p>
  ②查看效果
</p>
<p><img loading="lazy" decoding="async" width="653" height="343" src="/wp-content/uploads/2018/05/word-image-3391.png" class="wp-image-3844" srcset="/wp-content/uploads/2018/05/word-image-3391.png 653w, /wp-content/uploads/2018/05/word-image-3391-300x158.png 300w" sizes="(max-width: 653px) 100vw, 653px" /></p>
<p>
  ③不填写内容时的提交
</p>
<p><img loading="lazy" decoding="async" width="631" height="196" src="/wp-content/uploads/2018/05/word-image-3392.png" class="wp-image-3845" srcset="/wp-content/uploads/2018/05/word-image-3392.png 631w, /wp-content/uploads/2018/05/word-image-3392-300x93.png 300w" sizes="(max-width: 631px) 100vw, 631px" /></p>
<p>
  ④修改代码获取提示内容
</p>
<p><img loading="lazy" decoding="async" width="937" height="703" src="/wp-content/uploads/2018/05/word-image-3393.png" class="wp-image-3846" srcset="/wp-content/uploads/2018/05/word-image-3393.png 937w, /wp-content/uploads/2018/05/word-image-3393-300x225.png 300w, /wp-content/uploads/2018/05/word-image-3393-768x576.png 768w" sizes="(max-width: 937px) 100vw, 937px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="618" height="383" src="/wp-content/uploads/2018/05/word-image-3394.png" class="wp-image-3847" srcset="/wp-content/uploads/2018/05/word-image-3394.png 618w, /wp-content/uploads/2018/05/word-image-3394-300x186.png 300w" sizes="(max-width: 618px) 100vw, 618px" /></p>
<p>
  ⑤关于系统支持的正则表达式
</p>
<p><img loading="lazy" decoding="async" width="1077" height="628" src="/wp-content/uploads/2018/05/word-image-3395.png" class="wp-image-3848" srcset="/wp-content/uploads/2018/05/word-image-3395.png 1077w, /wp-content/uploads/2018/05/word-image-3395-300x175.png 300w, /wp-content/uploads/2018/05/word-image-3395-768x448.png 768w, /wp-content/uploads/2018/05/word-image-3395-1024x597.png 1024w" sizes="(max-width: 1077px) 100vw, 1077px" /></p>
<p>
  对于使用正则验证。对于第二个参数如果不使用系统内置的正则表达式可以自己编写正则
</p>
<h3>1.4.3、静态方式验证-函数</h3>
<p>
  函数可以使用php内置的已经TP中定的公共函数
</p>
<p>
  ①定义验证规则
</p>
<p><img loading="lazy" decoding="async" width="1097" height="494" src="/wp-content/uploads/2018/05/word-image-3396.png" class="wp-image-3849" srcset="/wp-content/uploads/2018/05/word-image-3396.png 1097w, /wp-content/uploads/2018/05/word-image-3396-300x135.png 300w, /wp-content/uploads/2018/05/word-image-3396-768x346.png 768w, /wp-content/uploads/2018/05/word-image-3396-1024x461.png 1024w" sizes="(max-width: 1097px) 100vw, 1097px" /></p>
<p>
  ②创建自定义的公共函数
</p>
<p><img loading="lazy" decoding="async" width="987" height="480" src="/wp-content/uploads/2018/05/word-image-3397.png" class="wp-image-3850" srcset="/wp-content/uploads/2018/05/word-image-3397.png 987w, /wp-content/uploads/2018/05/word-image-3397-300x146.png 300w, /wp-content/uploads/2018/05/word-image-3397-768x373.png 768w" sizes="(max-width: 987px) 100vw, 987px" /></p>
<p>
  ③查看效果
</p>
<p><img loading="lazy" decoding="async" width="598" height="341" src="/wp-content/uploads/2018/05/word-image-3398.png" class="wp-image-3851" srcset="/wp-content/uploads/2018/05/word-image-3398.png 598w, /wp-content/uploads/2018/05/word-image-3398-300x171.png 300w" sizes="(max-width: 598px) 100vw, 598px" /></p>
<h3>1.4.4、静态方式验证-方法</h3>
<p>
  ①增加验证规则
</p>
<p><img loading="lazy" decoding="async" width="1072" height="525" src="/wp-content/uploads/2018/05/word-image-3399.png" class="wp-image-3852" srcset="/wp-content/uploads/2018/05/word-image-3399.png 1072w, /wp-content/uploads/2018/05/word-image-3399-300x147.png 300w, /wp-content/uploads/2018/05/word-image-3399-768x376.png 768w, /wp-content/uploads/2018/05/word-image-3399-1024x501.png 1024w" sizes="(max-width: 1072px) 100vw, 1072px" /></p>
<p>
  ②增加方法
</p>
<p><img loading="lazy" decoding="async" width="1063" height="461" src="/wp-content/uploads/2018/05/word-image-3400.png" class="wp-image-3853" srcset="/wp-content/uploads/2018/05/word-image-3400.png 1063w, /wp-content/uploads/2018/05/word-image-3400-300x130.png 300w, /wp-content/uploads/2018/05/word-image-3400-768x333.png 768w, /wp-content/uploads/2018/05/word-image-3400-1024x444.png 1024w" sizes="(max-width: 1063px) 100vw, 1063px" /></p>
<p>
  ③效果
</p>
<p><img loading="lazy" decoding="async" width="542" height="365" src="/wp-content/uploads/2018/05/word-image-3401.png" class="wp-image-3854" srcset="/wp-content/uploads/2018/05/word-image-3401.png 542w, /wp-content/uploads/2018/05/word-image-3401-300x202.png 300w" sizes="(max-width: 542px) 100vw, 542px" /></p>
<h3>1.4.5、使用动态方式进行验证</h3>
<p>
  ①注释静态的方式验证
</p>
<p><img loading="lazy" decoding="async" width="1066" height="634" src="/wp-content/uploads/2018/05/word-image-3402.png" class="wp-image-3855" srcset="/wp-content/uploads/2018/05/word-image-3402.png 1066w, /wp-content/uploads/2018/05/word-image-3402-300x178.png 300w, /wp-content/uploads/2018/05/word-image-3402-768x457.png 768w, /wp-content/uploads/2018/05/word-image-3402-1024x609.png 1024w" sizes="(max-width: 1066px) 100vw, 1066px" /></p>
<p>
  ②创建测试方法显示模板并且提交验证
</p>
<p><img loading="lazy" decoding="async" width="1023" height="685" src="/wp-content/uploads/2018/05/word-image-3403.png" class="wp-image-3856" srcset="/wp-content/uploads/2018/05/word-image-3403.png 1023w, /wp-content/uploads/2018/05/word-image-3403-300x201.png 300w, /wp-content/uploads/2018/05/word-image-3403-768x514.png 768w" sizes="(max-width: 1023px) 100vw, 1023px" /></p>
<h2>1.5、字段映射</h2>
<p>
  在实际处理表单提交时，在每一个文本框中需要设置表单名称。对于表单名称一般都是使用数据表的字段名称。此方式存在安全隐患。暴露了数据表的字段信息。可以通过使用字段映射功能隐藏真实数据表的字段名称
</p>
<p>
  ①增加自定义字段映射
</p>
<p><img loading="lazy" decoding="async" width="912" height="400" src="/wp-content/uploads/2018/05/word-image-3404.png" class="wp-image-3857" srcset="/wp-content/uploads/2018/05/word-image-3404.png 912w, /wp-content/uploads/2018/05/word-image-3404-300x132.png 300w, /wp-content/uploads/2018/05/word-image-3404-768x337.png 768w" sizes="(max-width: 912px) 100vw, 912px" /></p>
<p>
  ②创建方法
</p>
<p><img loading="lazy" decoding="async" width="813" height="513" src="/wp-content/uploads/2018/05/word-image-3405.png" class="wp-image-3858" srcset="/wp-content/uploads/2018/05/word-image-3405.png 813w, /wp-content/uploads/2018/05/word-image-3405-300x189.png 300w, /wp-content/uploads/2018/05/word-image-3405-768x485.png 768w" sizes="(max-width: 813px) 100vw, 813px" /></p>
<p>
  ③创建模板
</p>
<p><img loading="lazy" decoding="async" width="992" height="583" src="/wp-content/uploads/2018/05/word-image-3406.png" class="wp-image-3859" srcset="/wp-content/uploads/2018/05/word-image-3406.png 992w, /wp-content/uploads/2018/05/word-image-3406-300x176.png 300w, /wp-content/uploads/2018/05/word-image-3406-768x451.png 768w" sizes="(max-width: 992px) 100vw, 992px" /></p>
<h2>1.6、自动完成</h2>
<p>
  在使用create时自动处理数据。例如有addtime字段需要记录写入时间。可以通过自动完成当create创建数据之后。会自动的增加对应的内容
</p>
<h3>1.6.1、自动完成规则</h3>
<p><img loading="lazy" decoding="async" width="1049" height="402" src="/wp-content/uploads/2018/05/word-image-3407.png" class="wp-image-3860" srcset="/wp-content/uploads/2018/05/word-image-3407.png 1049w, /wp-content/uploads/2018/05/word-image-3407-300x115.png 300w, /wp-content/uploads/2018/05/word-image-3407-768x294.png 768w, /wp-content/uploads/2018/05/word-image-3407-1024x392.png 1024w" sizes="(max-width: 1049px) 100vw, 1049px" /></p>
<p>
  完成字段：填写具体的字段名称即可
</p>
<p>
  完成规则：与附加规则配合使用。附加规则指定具体完成方式。完成规则在附加规则的基础上再次确认使用哪种更为准确的方式进行处理
</p>
<p>
  当附加规则为function 完成规则需要写上函数名称
</p>
<p>
  当附加规则为callback完成规则需要写上当前模型下的方法名称
</p>
<p>
  完成条件：规定使用规则的时间
</p>
<p><img loading="lazy" decoding="async" width="605" height="275" src="/wp-content/uploads/2018/05/word-image-3408.png" class="wp-image-3861" srcset="/wp-content/uploads/2018/05/word-image-3408.png 605w, /wp-content/uploads/2018/05/word-image-3408-300x136.png 300w" sizes="(max-width: 605px) 100vw, 605px" /></p>
<p>
  附加规则：指定自动完成方式
</p>
<p><img loading="lazy" decoding="async" width="664" height="358" src="/wp-content/uploads/2018/05/word-image-3409.png" class="wp-image-3862" srcset="/wp-content/uploads/2018/05/word-image-3409.png 664w, /wp-content/uploads/2018/05/word-image-3409-300x162.png 300w" sizes="(max-width: 664px) 100vw, 664px" /></p>
<h3>1.6.2、自动完成案例</h3>
<p>
  ①修改表结果
</p>
<p><img loading="lazy" decoding="async" width="669" height="336" src="/wp-content/uploads/2018/05/word-image-3410.png" class="wp-image-3863" srcset="/wp-content/uploads/2018/05/word-image-3410.png 669w, /wp-content/uploads/2018/05/word-image-3410-300x151.png 300w" sizes="(max-width: 669px) 100vw, 669px" /></p>
<p>
  ②修改自定义的字段信息
</p>
<p><img loading="lazy" decoding="async" width="972" height="316" src="/wp-content/uploads/2018/05/word-image-3411.png" class="wp-image-3864" srcset="/wp-content/uploads/2018/05/word-image-3411.png 972w, /wp-content/uploads/2018/05/word-image-3411-300x98.png 300w, /wp-content/uploads/2018/05/word-image-3411-768x250.png 768w" sizes="(max-width: 972px) 100vw, 972px" /></p>
<p>
  ③创建自动完成规则
</p>
<p><img loading="lazy" decoding="async" width="865" height="343" src="/wp-content/uploads/2018/05/word-image-3412.png" class="wp-image-3865" srcset="/wp-content/uploads/2018/05/word-image-3412.png 865w, /wp-content/uploads/2018/05/word-image-3412-300x119.png 300w, /wp-content/uploads/2018/05/word-image-3412-768x305.png 768w" sizes="(max-width: 865px) 100vw, 865px" /></p>
<p>
  ④查看效果
</p>
<p><img loading="lazy" decoding="async" width="572" height="239" src="/wp-content/uploads/2018/05/word-image-3413.png" class="wp-image-3866" srcset="/wp-content/uploads/2018/05/word-image-3413.png 572w, /wp-content/uploads/2018/05/word-image-3413-300x125.png 300w" sizes="(max-width: 572px) 100vw, 572px" /></p>
<p>
  自动完成帮助自动增加或者修改数据的
</p>
<h2>1.7、特殊表操作</h2>
<p>
  一般模型名称跟数据表的名称保持一致的。但是部分业务场景可能数据表的名称比较奇怪。对此情况可以使用模型中提供的属性tableName跟trueTbaleName控制操作的数据表
</p>
<h3>1.7.1、tableName</h3>
<p>
  指定表的名称不包括表前缀。表前缀会自动的补上
</p>
<p>
  ①复制数据表
</p>
<p><img loading="lazy" decoding="async" width="720" height="354" src="/wp-content/uploads/2018/05/word-image-3414.png" class="wp-image-3867" srcset="/wp-content/uploads/2018/05/word-image-3414.png 720w, /wp-content/uploads/2018/05/word-image-3414-300x148.png 300w" sizes="(max-width: 720px) 100vw, 720px" /></p>
<p>
  ②在模型中定义表的名称
</p>
<p><img loading="lazy" decoding="async" width="1064" height="393" src="/wp-content/uploads/2018/05/word-image-3415.png" class="wp-image-3868" srcset="/wp-content/uploads/2018/05/word-image-3415.png 1064w, /wp-content/uploads/2018/05/word-image-3415-300x111.png 300w, /wp-content/uploads/2018/05/word-image-3415-768x284.png 768w, /wp-content/uploads/2018/05/word-image-3415-1024x378.png 1024w" sizes="(max-width: 1064px) 100vw, 1064px" /></p>
<p>
  ③修改方法实现数据写入
</p>
<p><img loading="lazy" decoding="async" width="937" height="565" src="/wp-content/uploads/2018/05/word-image-3416.png" class="wp-image-3869" srcset="/wp-content/uploads/2018/05/word-image-3416.png 937w, /wp-content/uploads/2018/05/word-image-3416-300x181.png 300w, /wp-content/uploads/2018/05/word-image-3416-768x463.png 768w" sizes="(max-width: 937px) 100vw, 937px" /></p>
<p>
  ④查看效果
</p>
<p><img loading="lazy" decoding="async" width="614" height="200" src="/wp-content/uploads/2018/05/word-image-3417.png" class="wp-image-3870" srcset="/wp-content/uploads/2018/05/word-image-3417.png 614w, /wp-content/uploads/2018/05/word-image-3417-300x98.png 300w" sizes="(max-width: 614px) 100vw, 614px" /></p>
<h3>1.7.2、trueTableName</h3>
<p>
  真实表名称
</p>
<p>
  ①复制数据表
</p>
<p><img loading="lazy" decoding="async" width="626" height="376" src="/wp-content/uploads/2018/05/word-image-3418.png" class="wp-image-3871" srcset="/wp-content/uploads/2018/05/word-image-3418.png 626w, /wp-content/uploads/2018/05/word-image-3418-300x180.png 300w" sizes="(max-width: 626px) 100vw, 626px" /></p>
<p>
  ②指定模型对应的真实表名称
</p>
<p><img loading="lazy" decoding="async" width="1016" height="324" src="/wp-content/uploads/2018/05/word-image-3419.png" class="wp-image-3872" srcset="/wp-content/uploads/2018/05/word-image-3419.png 1016w, /wp-content/uploads/2018/05/word-image-3419-300x96.png 300w, /wp-content/uploads/2018/05/word-image-3419-768x245.png 768w" sizes="(max-width: 1016px) 100vw, 1016px" /></p>
<p>
  ③数据写入
</p>
<p><img loading="lazy" decoding="async" width="589" height="243" src="/wp-content/uploads/2018/05/word-image-3420.png" class="wp-image-3873" srcset="/wp-content/uploads/2018/05/word-image-3420.png 589w, /wp-content/uploads/2018/05/word-image-3420-300x124.png 300w" sizes="(max-width: 589px) 100vw, 589px" /></p>
<h3>1.7.3、connection指定连接的数据库</h3>
<p>
  ①修改模板连接的数据库
</p>
<p><img loading="lazy" decoding="async" width="1057" height="456" src="/wp-content/uploads/2018/05/word-image-3421.png" class="wp-image-3874" srcset="/wp-content/uploads/2018/05/word-image-3421.png 1057w, /wp-content/uploads/2018/05/word-image-3421-300x129.png 300w, /wp-content/uploads/2018/05/word-image-3421-768x331.png 768w, /wp-content/uploads/2018/05/word-image-3421-1024x442.png 1024w" sizes="(max-width: 1057px) 100vw, 1057px" /></p>
<p>
  由于配置项中存在tp_shop数据库的配置。Connection对应的值跟M函数的第三个参数是一致
</p>
<p>
  ②在tp5_shop下创建数据表
</p>
<p><img loading="lazy" decoding="async" width="648" height="503" src="/wp-content/uploads/2018/05/word-image-3422.png" class="wp-image-3875" srcset="/wp-content/uploads/2018/05/word-image-3422.png 648w, /wp-content/uploads/2018/05/word-image-3422-300x233.png 300w" sizes="(max-width: 648px) 100vw, 648px" /></p>
<p>
  ③测试
</p>
<p><img loading="lazy" decoding="async" width="824" height="172" src="/wp-content/uploads/2018/05/word-image-3423.png" class="wp-image-3876" srcset="/wp-content/uploads/2018/05/word-image-3423.png 824w, /wp-content/uploads/2018/05/word-image-3423-300x63.png 300w, /wp-content/uploads/2018/05/word-image-3423-768x160.png 768w" sizes="(max-width: 824px) 100vw, 824px" /><br />
<img loading="lazy" decoding="async" width="587" height="248" src="/wp-content/uploads/2018/05/word-image-3424.png" class="wp-image-3877" srcset="/wp-content/uploads/2018/05/word-image-3424.png 587w, /wp-content/uploads/2018/05/word-image-3424-300x127.png 300w" sizes="(max-width: 587px) 100vw, 587px" /></p>
<p>
  从目前所知模型名称不一定要跟数据表的名称绝对保持一致。但是一般都会使用同名
</p>
<h2>1.8、连贯操作（重点）</h2>
<p>
  对于目前数据的CURD操作只能进行简单的操作。当需要设计复杂的SQL语句操作可以使用连贯操作中提供的方法。常用的where、limit、order、page。
</p>
<p>
  对于连贯方法使用：模型对象-&gt;连贯方法-&gt;curd方法
</p>
<p>
  在使用连贯方法的过程中没有任何的优先顺序
</p>
<p><img loading="lazy" decoding="async" width="835" height="420" src="/wp-content/uploads/2018/05/word-image-3425.png" class="wp-image-3878" srcset="/wp-content/uploads/2018/05/word-image-3425.png 835w, /wp-content/uploads/2018/05/word-image-3425-300x151.png 300w, /wp-content/uploads/2018/05/word-image-3425-768x386.png 768w" sizes="(max-width: 835px) 100vw, 835px" /></p>
<h3>1.8.1、where使用</h3>
<p>
  Where的作用指定具体的sql语句中的where条件
</p>
<p>
  ①where字符串参数的格式
</p>
<p><img loading="lazy" decoding="async" width="1042" height="547" src="/wp-content/uploads/2018/05/word-image-3426.png" class="wp-image-3879" srcset="/wp-content/uploads/2018/05/word-image-3426.png 1042w, /wp-content/uploads/2018/05/word-image-3426-300x157.png 300w, /wp-content/uploads/2018/05/word-image-3426-768x403.png 768w, /wp-content/uploads/2018/05/word-image-3426-1024x538.png 1024w" sizes="(max-width: 1042px) 100vw, 1042px" /></p>
<p>
  结果如下
</p>
<p><img loading="lazy" decoding="async" width="773" height="307" src="/wp-content/uploads/2018/05/word-image-3427.png" class="wp-image-3880" srcset="/wp-content/uploads/2018/05/word-image-3427.png 773w, /wp-content/uploads/2018/05/word-image-3427-300x119.png 300w, /wp-content/uploads/2018/05/word-image-3427-768x305.png 768w" sizes="(max-width: 773px) 100vw, 773px" /></p>
<p>
  ②where数组参数的格式
</p>
<p>
  <br />
  ③where预处理
</p>
<p><img loading="lazy" decoding="async" width="708" height="306" src="/wp-content/uploads/2018/05/word-image-3428.png" class="wp-image-3881" srcset="/wp-content/uploads/2018/05/word-image-3428.png 708w, /wp-content/uploads/2018/05/word-image-3428-300x130.png 300w" sizes="(max-width: 708px) 100vw, 708px" /><br />
<img loading="lazy" decoding="async" width="1074" height="653" src="/wp-content/uploads/2018/05/word-image-3429.png" class="wp-image-3882" srcset="/wp-content/uploads/2018/05/word-image-3429.png 1074w, /wp-content/uploads/2018/05/word-image-3429-300x182.png 300w, /wp-content/uploads/2018/05/word-image-3429-768x467.png 768w, /wp-content/uploads/2018/05/word-image-3429-1024x623.png 1024w" sizes="(max-width: 1074px) 100vw, 1074px" /></p>
<p>
  ④where指定like查询
</p>
<p><img loading="lazy" decoding="async" width="1045" height="675" src="/wp-content/uploads/2018/05/word-image-3430.png" class="wp-image-3883" srcset="/wp-content/uploads/2018/05/word-image-3430.png 1045w, /wp-content/uploads/2018/05/word-image-3430-300x194.png 300w, /wp-content/uploads/2018/05/word-image-3430-768x496.png 768w, /wp-content/uploads/2018/05/word-image-3430-1024x661.png 1024w" sizes="(max-width: 1045px) 100vw, 1045px" /><br />
<img loading="lazy" decoding="async" width="759" height="356" src="/wp-content/uploads/2018/05/word-image-3431.png" class="wp-image-3884" srcset="/wp-content/uploads/2018/05/word-image-3431.png 759w, /wp-content/uploads/2018/05/word-image-3431-300x141.png 300w" sizes="(max-width: 759px) 100vw, 759px" /></p>
<h3>1.8.2、field指定字段信息</h3>
<p>
  一般查询数据尽量不要使用*,而是指定字段。需要哪些字段就指定哪些
</p>
<p><img loading="lazy" decoding="async" width="1014" height="381" src="/wp-content/uploads/2018/05/word-image-3432.png" class="wp-image-3885" srcset="/wp-content/uploads/2018/05/word-image-3432.png 1014w, /wp-content/uploads/2018/05/word-image-3432-300x113.png 300w, /wp-content/uploads/2018/05/word-image-3432-768x289.png 768w" sizes="(max-width: 1014px) 100vw, 1014px" /></p>
<p>
  结果如下
</p>
<p><img loading="lazy" decoding="async" width="659" height="426" src="/wp-content/uploads/2018/05/word-image-3433.png" class="wp-image-3886" srcset="/wp-content/uploads/2018/05/word-image-3433.png 659w, /wp-content/uploads/2018/05/word-image-3433-300x194.png 300w" sizes="(max-width: 659px) 100vw, 659px" /></p>
<h3>1.8.3、limit限制条数</h3>
<p>
  作用限制sql语句中limit条目数、可以实现分页功能
</p>
<p>
  ①传递一个数字参数
</p>
<p><img loading="lazy" decoding="async" width="1052" height="430" src="/wp-content/uploads/2018/05/word-image-3434.png" class="wp-image-3887" srcset="/wp-content/uploads/2018/05/word-image-3434.png 1052w, /wp-content/uploads/2018/05/word-image-3434-300x123.png 300w, /wp-content/uploads/2018/05/word-image-3434-768x314.png 768w, /wp-content/uploads/2018/05/word-image-3434-1024x419.png 1024w" sizes="(max-width: 1052px) 100vw, 1052px" /><br />
<img loading="lazy" decoding="async" width="672" height="262" src="/wp-content/uploads/2018/05/word-image-3435.png" class="wp-image-3888" srcset="/wp-content/uploads/2018/05/word-image-3435.png 672w, /wp-content/uploads/2018/05/word-image-3435-300x117.png 300w" sizes="(max-width: 672px) 100vw, 672px" /></p>
<p>
  ②传递字符串的参数
</p>
<p><img loading="lazy" decoding="async" width="1039" height="574" src="/wp-content/uploads/2018/05/word-image-3436.png" class="wp-image-3889" srcset="/wp-content/uploads/2018/05/word-image-3436.png 1039w, /wp-content/uploads/2018/05/word-image-3436-300x166.png 300w, /wp-content/uploads/2018/05/word-image-3436-768x424.png 768w, /wp-content/uploads/2018/05/word-image-3436-1024x566.png 1024w" sizes="(max-width: 1039px) 100vw, 1039px" /><br />
<img loading="lazy" decoding="async" width="752" height="255" src="/wp-content/uploads/2018/05/word-image-3437.png" class="wp-image-3890" srcset="/wp-content/uploads/2018/05/word-image-3437.png 752w, /wp-content/uploads/2018/05/word-image-3437-300x102.png 300w" sizes="(max-width: 752px) 100vw, 752px" /></p>
<p>
  对于此方式可以实现分页功能
</p>
<h3>1.8.4、page分页</h3>
<p>
  Page也是用于限制条数。也可以用于分页。但是在使用分页时page方法不需要进行运算。直接传递页码即可
</p>
<p><img loading="lazy" decoding="async" width="1044" height="497" src="/wp-content/uploads/2018/05/word-image-3438.png" class="wp-image-3891" srcset="/wp-content/uploads/2018/05/word-image-3438.png 1044w, /wp-content/uploads/2018/05/word-image-3438-300x143.png 300w, /wp-content/uploads/2018/05/word-image-3438-768x366.png 768w, /wp-content/uploads/2018/05/word-image-3438-1024x487.png 1024w" sizes="(max-width: 1044px) 100vw, 1044px" /><br />
<img loading="lazy" decoding="async" width="634" height="241" src="/wp-content/uploads/2018/05/word-image-3439.png" class="wp-image-3892" srcset="/wp-content/uploads/2018/05/word-image-3439.png 634w, /wp-content/uploads/2018/05/word-image-3439-300x114.png 300w" sizes="(max-width: 634px) 100vw, 634px" /></p>
<h3>1.8.5、Order排序</h3>
<p><img loading="lazy" decoding="async" width="1028" height="465" src="/wp-content/uploads/2018/05/word-image-3440.png" class="wp-image-3893" srcset="/wp-content/uploads/2018/05/word-image-3440.png 1028w, /wp-content/uploads/2018/05/word-image-3440-300x136.png 300w, /wp-content/uploads/2018/05/word-image-3440-768x347.png 768w, /wp-content/uploads/2018/05/word-image-3440-1024x463.png 1024w" sizes="(max-width: 1028px) 100vw, 1028px" /><br />
<img loading="lazy" decoding="async" width="788" height="263" src="/wp-content/uploads/2018/05/word-image-3441.png" class="wp-image-3894" srcset="/wp-content/uploads/2018/05/word-image-3441.png 788w, /wp-content/uploads/2018/05/word-image-3441-300x100.png 300w, /wp-content/uploads/2018/05/word-image-3441-768x256.png 768w" sizes="(max-width: 788px) 100vw, 788px" /></p>
<h2>1.9、模型中的钩子函数</h2>
<p>
  当进行数据的增删改查操作时。如果有定义对应的钩子函数。会自动的进行。对于钩子函数可以实现格式化处理或者是去处理其他的业务逻辑。
</p>
<p>
  增加：_before_insert前置钩子函数 _after_insert后置钩子函数
</p>
<p>
  删除：_before_delete前置钩子函数 _after_delete后置钩子函数
</p>
<p>
  修改：_before_update前置钩子函数 _after_update后置钩子函数
</p>
<p>
  查询：_after_select后置钩子函数
</p>
<h3>1.9.1、添加的前置钩子函数</h3>
<p>
  ①创建方法
</p>
<p><img loading="lazy" decoding="async" width="868" height="479" src="/wp-content/uploads/2018/05/word-image-3442.png" class="wp-image-3895" srcset="/wp-content/uploads/2018/05/word-image-3442.png 868w, /wp-content/uploads/2018/05/word-image-3442-300x166.png 300w, /wp-content/uploads/2018/05/word-image-3442-768x424.png 768w" sizes="(max-width: 868px) 100vw, 868px" /></p>
<p>
  ②创建前置的钩子函数
</p>
<p><img loading="lazy" decoding="async" width="904" height="534" src="/wp-content/uploads/2018/05/word-image-3443.png" class="wp-image-3896" srcset="/wp-content/uploads/2018/05/word-image-3443.png 904w, /wp-content/uploads/2018/05/word-image-3443-300x177.png 300w, /wp-content/uploads/2018/05/word-image-3443-768x454.png 768w" sizes="(max-width: 904px) 100vw, 904px" /></p>
<p>
  ③查看效果
</p>
<p><img loading="lazy" decoding="async" width="681" height="152" src="/wp-content/uploads/2018/05/word-image-3444.png" class="wp-image-3897" srcset="/wp-content/uploads/2018/05/word-image-3444.png 681w, /wp-content/uploads/2018/05/word-image-3444-300x67.png 300w" sizes="(max-width: 681px) 100vw, 681px" /><br />
<img loading="lazy" decoding="async" width="578" height="263" src="/wp-content/uploads/2018/05/word-image-3445.png" class="wp-image-3898" srcset="/wp-content/uploads/2018/05/word-image-3445.png 578w, /wp-content/uploads/2018/05/word-image-3445-300x137.png 300w" sizes="(max-width: 578px) 100vw, 578px" /></p>
<h3>1.9.2、后置钩子函数</h3>
<p><img loading="lazy" decoding="async" width="1012" height="593" src="/wp-content/uploads/2018/05/word-image-3446.png" class="wp-image-3899" srcset="/wp-content/uploads/2018/05/word-image-3446.png 1012w, /wp-content/uploads/2018/05/word-image-3446-300x176.png 300w, /wp-content/uploads/2018/05/word-image-3446-768x450.png 768w" sizes="(max-width: 1012px) 100vw, 1012px" /><br />
<img loading="lazy" decoding="async" width="845" height="417" src="/wp-content/uploads/2018/05/word-image-3447.png" class="wp-image-3900" srcset="/wp-content/uploads/2018/05/word-image-3447.png 845w, /wp-content/uploads/2018/05/word-image-3447-300x148.png 300w, /wp-content/uploads/2018/05/word-image-3447-768x379.png 768w" sizes="(max-width: 845px) 100vw, 845px" /></p>
<h2>1.9、trace工具使用</h2>
<p>
  Trace工具可以帮助分析整个框架执行流程以及对项目进行性能的分析
</p>
<p>
  ①开启trace工具
</p>
<p><img loading="lazy" decoding="async" width="989" height="525" src="/wp-content/uploads/2018/05/word-image-3448.png" class="wp-image-3901" srcset="/wp-content/uploads/2018/05/word-image-3448.png 989w, /wp-content/uploads/2018/05/word-image-3448-300x159.png 300w, /wp-content/uploads/2018/05/word-image-3448-768x408.png 768w" sizes="(max-width: 989px) 100vw, 989px" /></p>
<p>
  ②查看效果
</p>
<p><img loading="lazy" decoding="async" width="844" height="694" src="/wp-content/uploads/2018/05/word-image-3449.png" class="wp-image-3902" srcset="/wp-content/uploads/2018/05/word-image-3449.png 844w, /wp-content/uploads/2018/05/word-image-3449-300x247.png 300w, /wp-content/uploads/2018/05/word-image-3449-768x632.png 768w" sizes="(max-width: 844px) 100vw, 844px" /></p>
<p>
  会发现右下角有一个小图标，可以点击查看具体的情况
</p>
<p><img loading="lazy" decoding="async" width="836" height="659" src="/wp-content/uploads/2018/05/word-image-3450.png" class="wp-image-3903" srcset="/wp-content/uploads/2018/05/word-image-3450.png 836w, /wp-content/uploads/2018/05/word-image-3450-300x236.png 300w, /wp-content/uploads/2018/05/word-image-3450-768x605.png 768w" sizes="(max-width: 836px) 100vw, 836px" /></p>
]]></content:encoded>
					
					<wfw:commentRss>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/3815.html/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>TP 3.2 （四）模型, 统计方法、连表查询、Session 机制、分类、验证码、电商后台</title>
		<link>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/3732.html</link>
					<comments>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/3732.html#respond</comments>
		
		<dc:creator><![CDATA[Mr.Lee]]></dc:creator>
		<pubDate>Sat, 19 May 2018 13:05:47 +0000</pubDate>
				<category><![CDATA[TP3.2]]></category>
		<category><![CDATA[后台框架]]></category>
		<category><![CDATA[Session 机制]]></category>
		<category><![CDATA[分类]]></category>
		<category><![CDATA[模型]]></category>
		<category><![CDATA[电商后台]]></category>
		<category><![CDATA[统计方法]]></category>
		<category><![CDATA[连表查询]]></category>
		<category><![CDATA[验证码]]></category>
		<guid isPermaLink="false">/?p=3732</guid>

					<description><![CDATA[TP中的模型(三) 1.1、AR模式 AR模式ActiveRecords模式的ORM模型，采用了非标准的ORM [&#8230;]]]></description>
										<content:encoded><![CDATA[<h1>TP中的模型(三)</h1>
<h2>1.1、AR模式</h2>
<p>
  AR模式ActiveRecords模式的ORM模型，采用了非标准的ORM模型。模型对应数据表，对象对应数据行，属性对应数据字段。AR模式是采用面向对象思想(OOP)。对于此方式新的框架中都是采用的ORM模式
</p>
<h3>1.1.1、演示数据的写入</h3>
<p>
  ①创建测试方法
</p>
<p><img loading="lazy" decoding="async" width="1045" height="507" src="/wp-content/uploads/2018/05/word-image-3283.png" class="wp-image-3733" srcset="/wp-content/uploads/2018/05/word-image-3283.png 1045w, /wp-content/uploads/2018/05/word-image-3283-300x146.png 300w, /wp-content/uploads/2018/05/word-image-3283-768x373.png 768w, /wp-content/uploads/2018/05/word-image-3283-1024x497.png 1024w" sizes="(max-width: 1045px) 100vw, 1045px" /></p>
<p>
  ②访问查看写入数据
</p>
<p><img loading="lazy" decoding="async" width="513" height="520" src="/wp-content/uploads/2018/05/word-image-3284.png" class="wp-image-3734" srcset="/wp-content/uploads/2018/05/word-image-3284.png 513w, /wp-content/uploads/2018/05/word-image-3284-296x300.png 296w" sizes="(max-width: 513px) 100vw, 513px" /></p>
<h3>1.1.2、演示数据查询</h3>
<p>
  ①创建测试方法
</p>
<p><img loading="lazy" decoding="async" width="845" height="367" src="/wp-content/uploads/2018/05/word-image-3285.png" class="wp-image-3735" srcset="/wp-content/uploads/2018/05/word-image-3285.png 845w, /wp-content/uploads/2018/05/word-image-3285-300x130.png 300w, /wp-content/uploads/2018/05/word-image-3285-768x334.png 768w" sizes="(max-width: 845px) 100vw, 845px" /></p>
<p>
  ②查看结果
</p>
<p><img loading="lazy" decoding="async" width="765" height="156" src="/wp-content/uploads/2018/05/word-image-3286.png" class="wp-image-3736" srcset="/wp-content/uploads/2018/05/word-image-3286.png 765w, /wp-content/uploads/2018/05/word-image-3286-300x61.png 300w" sizes="(max-width: 765px) 100vw, 765px" /><br />
<img loading="lazy" decoding="async" width="611" height="170" src="/wp-content/uploads/2018/05/word-image-3287.png" class="wp-image-3737" srcset="/wp-content/uploads/2018/05/word-image-3287.png 611w, /wp-content/uploads/2018/05/word-image-3287-300x83.png 300w" sizes="(max-width: 611px) 100vw, 611px" /></p>
<p>
  ③根据条件进行查询
</p>
<p><img loading="lazy" decoding="async" width="897" height="355" src="/wp-content/uploads/2018/05/word-image-3288.png" class="wp-image-3738" srcset="/wp-content/uploads/2018/05/word-image-3288.png 897w, /wp-content/uploads/2018/05/word-image-3288-300x119.png 300w, /wp-content/uploads/2018/05/word-image-3288-768x304.png 768w" sizes="(max-width: 897px) 100vw, 897px" /><br />
<img loading="lazy" decoding="async" width="775" height="297" src="/wp-content/uploads/2018/05/word-image-3289.png" class="wp-image-3739" srcset="/wp-content/uploads/2018/05/word-image-3289.png 775w, /wp-content/uploads/2018/05/word-image-3289-300x115.png 300w, /wp-content/uploads/2018/05/word-image-3289-768x294.png 768w" sizes="(max-width: 775px) 100vw, 775px" /></p>
<h2>1.2、TP中的统计方法</h2>
<p><img loading="lazy" decoding="async" width="700" height="379" src="/wp-content/uploads/2018/05/word-image-3290.png" class="wp-image-3740" srcset="/wp-content/uploads/2018/05/word-image-3290.png 700w, /wp-content/uploads/2018/05/word-image-3290-300x162.png 300w" sizes="(max-width: 700px) 100vw, 700px" /><br />
<img loading="lazy" decoding="async" width="978" height="515" src="/wp-content/uploads/2018/05/word-image-3291.png" class="wp-image-3741" srcset="/wp-content/uploads/2018/05/word-image-3291.png 978w, /wp-content/uploads/2018/05/word-image-3291-300x158.png 300w, /wp-content/uploads/2018/05/word-image-3291-768x404.png 768w" sizes="(max-width: 978px) 100vw, 978px" /><br />
<img loading="lazy" decoding="async" width="826" height="325" src="/wp-content/uploads/2018/05/word-image-3292.png" class="wp-image-3742" srcset="/wp-content/uploads/2018/05/word-image-3292.png 826w, /wp-content/uploads/2018/05/word-image-3292-300x118.png 300w, /wp-content/uploads/2018/05/word-image-3292-768x302.png 768w" sizes="(max-width: 826px) 100vw, 826px" /></p>
<h2>1.3、连表查询</h2>
<p><img loading="lazy" decoding="async" width="799" height="311" src="/wp-content/uploads/2018/05/word-image-3293.png" class="wp-image-3743" srcset="/wp-content/uploads/2018/05/word-image-3293.png 799w, /wp-content/uploads/2018/05/word-image-3293-300x117.png 300w, /wp-content/uploads/2018/05/word-image-3293-768x299.png 768w" sizes="(max-width: 799px) 100vw, 799px" /></p>
<h3>1.3.1、inner join使用</h3>
<p>
  ①创建数据表并且写入测试数据
</p>
<p><img loading="lazy" decoding="async" width="528" height="432" src="/wp-content/uploads/2018/05/word-image-3294.png" class="wp-image-3744" srcset="/wp-content/uploads/2018/05/word-image-3294.png 528w, /wp-content/uploads/2018/05/word-image-3294-300x245.png 300w" sizes="(max-width: 528px) 100vw, 528px" /></p>
<p>
  ②连接查询
</p>
<p><img loading="lazy" decoding="async" width="1018" height="468" src="/wp-content/uploads/2018/05/word-image-3295.png" class="wp-image-3745" srcset="/wp-content/uploads/2018/05/word-image-3295.png 1018w, /wp-content/uploads/2018/05/word-image-3295-300x138.png 300w, /wp-content/uploads/2018/05/word-image-3295-768x353.png 768w" sizes="(max-width: 1018px) 100vw, 1018px" /></p>
<p>
  ③查看效果
</p>
<p><img loading="lazy" decoding="async" width="801" height="502" src="/wp-content/uploads/2018/05/word-image-3296.png" class="wp-image-3746" srcset="/wp-content/uploads/2018/05/word-image-3296.png 801w, /wp-content/uploads/2018/05/word-image-3296-300x188.png 300w, /wp-content/uploads/2018/05/word-image-3296-768x481.png 768w" sizes="(max-width: 801px) 100vw, 801px" /></p>
<p>
  ④使用field指定字段信息
</p>
<p><img loading="lazy" decoding="async" width="1019" height="431" src="/wp-content/uploads/2018/05/word-image-3297.png" class="wp-image-3747" srcset="/wp-content/uploads/2018/05/word-image-3297.png 1019w, /wp-content/uploads/2018/05/word-image-3297-300x127.png 300w, /wp-content/uploads/2018/05/word-image-3297-768x325.png 768w" sizes="(max-width: 1019px) 100vw, 1019px" /><br />
<img loading="lazy" decoding="async" width="749" height="472" src="/wp-content/uploads/2018/05/word-image-3298.png" class="wp-image-3748" srcset="/wp-content/uploads/2018/05/word-image-3298.png 749w, /wp-content/uploads/2018/05/word-image-3298-300x189.png 300w" sizes="(max-width: 749px) 100vw, 749px" /></p>
<h3>1.3.1、left join 使用</h3>
<p><img loading="lazy" decoding="async" width="1037" height="563" src="/wp-content/uploads/2018/05/word-image-3299.png" class="wp-image-3749" srcset="/wp-content/uploads/2018/05/word-image-3299.png 1037w, /wp-content/uploads/2018/05/word-image-3299-300x163.png 300w, /wp-content/uploads/2018/05/word-image-3299-768x417.png 768w, /wp-content/uploads/2018/05/word-image-3299-1024x556.png 1024w" sizes="(max-width: 1037px) 100vw, 1037px" /><br />
<img loading="lazy" decoding="async" width="718" height="413" src="/wp-content/uploads/2018/05/word-image-3300.png" class="wp-image-3750" srcset="/wp-content/uploads/2018/05/word-image-3300.png 718w, /wp-content/uploads/2018/05/word-image-3300-300x173.png 300w" sizes="(max-width: 718px) 100vw, 718px" /></p>
<h2>1.4、原生sql语句</h2>
<p>
  Query：执行查询的sql语句。返回结果集
</p>
<p>
  Execute：执行写入(增加、修改、删除)的SQL语句。返回受影响行数
</p>
<h3>1.4.1、演示query方法使用</h3>
<p><img loading="lazy" decoding="async" width="833" height="386" src="/wp-content/uploads/2018/05/word-image-3301.png" class="wp-image-3751" srcset="/wp-content/uploads/2018/05/word-image-3301.png 833w, /wp-content/uploads/2018/05/word-image-3301-300x139.png 300w, /wp-content/uploads/2018/05/word-image-3301-768x356.png 768w" sizes="(max-width: 833px) 100vw, 833px" /><br />
<img loading="lazy" decoding="async" width="668" height="407" src="/wp-content/uploads/2018/05/word-image-3302.png" class="wp-image-3752" srcset="/wp-content/uploads/2018/05/word-image-3302.png 668w, /wp-content/uploads/2018/05/word-image-3302-300x183.png 300w" sizes="(max-width: 668px) 100vw, 668px" /></p>
<h3>1.4.2、演示execute方法使用</h3>
<p><img loading="lazy" decoding="async" width="979" height="403" src="/wp-content/uploads/2018/05/word-image-3303.png" class="wp-image-3753" srcset="/wp-content/uploads/2018/05/word-image-3303.png 979w, /wp-content/uploads/2018/05/word-image-3303-300x123.png 300w, /wp-content/uploads/2018/05/word-image-3303-768x316.png 768w" sizes="(max-width: 979px) 100vw, 979px" /><br />
<img loading="lazy" decoding="async" width="722" height="404" src="/wp-content/uploads/2018/05/word-image-3304.png" class="wp-image-3754" srcset="/wp-content/uploads/2018/05/word-image-3304.png 722w, /wp-content/uploads/2018/05/word-image-3304-300x168.png 300w" sizes="(max-width: 722px) 100vw, 722px" /></p>
<h2>1.5、TP中的事物</h2>
<p>
  事物是mysql提供的一项功能。只针对innodb引擎的数据表。事物需要开启
</p>
<p>
  事物处理方法：
</p>
<p>
  startTrans：开启事物
</p>
<p>
  Rollback：回滚事物
</p>
<p>
  Commit：提交事物
</p>
<p>
  ①代码
</p>
<p><img loading="lazy" decoding="async" width="971" height="678" src="/wp-content/uploads/2018/05/word-image-3305.png" class="wp-image-3755" srcset="/wp-content/uploads/2018/05/word-image-3305.png 971w, /wp-content/uploads/2018/05/word-image-3305-300x209.png 300w, /wp-content/uploads/2018/05/word-image-3305-768x536.png 768w" sizes="(max-width: 971px) 100vw, 971px" /></p>
<p>
  ②结果
</p>
<p><img loading="lazy" decoding="async" width="1285" height="385" src="/wp-content/uploads/2018/05/word-image-3306.png" class="wp-image-3756" srcset="/wp-content/uploads/2018/05/word-image-3306.png 1285w, /wp-content/uploads/2018/05/word-image-3306-300x90.png 300w, /wp-content/uploads/2018/05/word-image-3306-768x230.png 768w, /wp-content/uploads/2018/05/word-image-3306-1024x307.png 1024w" sizes="(max-width: 1285px) 100vw, 1285px" /></p>
<h1>TP中的cookie与session</h1>
<h2>2.1、cookie与session的区别</h2>
<ol>
<li>
  cookie是存在客户端
</li>
<li>
  Session是存储在服务端
</li>
<li>
  Cookie保存的数据量有限
</li>
<li>
  session安全性更高
</li>
<li>
  session基于cookie之上的
</li>
</ol>
<h2>2.2、session机制</h2>
<p><img loading="lazy" decoding="async" width="1158" height="508" src="/wp-content/uploads/2018/05/word-image-3307.png" class="wp-image-3757" srcset="/wp-content/uploads/2018/05/word-image-3307.png 1158w, /wp-content/uploads/2018/05/word-image-3307-300x132.png 300w, /wp-content/uploads/2018/05/word-image-3307-768x337.png 768w, /wp-content/uploads/2018/05/word-image-3307-1024x449.png 1024w" sizes="(max-width: 1158px) 100vw, 1158px" /></p>
<h2>2.3、TP中session使用</h2>
<p>
  在TP中对于session的所有处理都通过使用session()函数进行处理。
</p>
<p>
  在框架载入时session就已经启动
</p>
<p><img loading="lazy" decoding="async" width="818" height="552" src="/wp-content/uploads/2018/05/word-image-3308.png" class="wp-image-3758" srcset="/wp-content/uploads/2018/05/word-image-3308.png 818w, /wp-content/uploads/2018/05/word-image-3308-300x202.png 300w, /wp-content/uploads/2018/05/word-image-3308-768x518.png 768w" sizes="(max-width: 818px) 100vw, 818px" /><br />
<img loading="lazy" decoding="async" width="840" height="658" src="/wp-content/uploads/2018/05/word-image-3309.png" class="wp-image-3759" srcset="/wp-content/uploads/2018/05/word-image-3309.png 840w, /wp-content/uploads/2018/05/word-image-3309-300x235.png 300w, /wp-content/uploads/2018/05/word-image-3309-768x602.png 768w" sizes="(max-width: 840px) 100vw, 840px" /></p>
<p>
  效果如下
</p>
<p>
  设置session
</p>
<p><img loading="lazy" decoding="async" width="629" height="312" src="/wp-content/uploads/2018/05/word-image-3310.png" class="wp-image-3760" srcset="/wp-content/uploads/2018/05/word-image-3310.png 629w, /wp-content/uploads/2018/05/word-image-3310-300x149.png 300w" sizes="(max-width: 629px) 100vw, 629px" /></p>
<p>
  获取session
</p>
<p><img loading="lazy" decoding="async" width="738" height="294" src="/wp-content/uploads/2018/05/word-image-3311.png" class="wp-image-3761" srcset="/wp-content/uploads/2018/05/word-image-3311.png 738w, /wp-content/uploads/2018/05/word-image-3311-300x120.png 300w" sizes="(max-width: 738px) 100vw, 738px" /></p>
<p>
  删除session
</p>
<p><img loading="lazy" decoding="async" width="595" height="226" src="/wp-content/uploads/2018/05/word-image-3312.png" class="wp-image-3762" srcset="/wp-content/uploads/2018/05/word-image-3312.png 595w, /wp-content/uploads/2018/05/word-image-3312-300x114.png 300w" sizes="(max-width: 595px) 100vw, 595px" /></p>
<p>
  再次查看session
</p>
<p><img loading="lazy" decoding="async" width="684" height="212" src="/wp-content/uploads/2018/05/word-image-3313.png" class="wp-image-3763" srcset="/wp-content/uploads/2018/05/word-image-3313.png 684w, /wp-content/uploads/2018/05/word-image-3313-300x93.png 300w" sizes="(max-width: 684px) 100vw, 684px" /></p>
<h2>2.4、cookie的使用</h2>
<p><img loading="lazy" decoding="async" width="1024" height="590" src="/wp-content/uploads/2018/05/word-image-3314.png" class="wp-image-3764" srcset="/wp-content/uploads/2018/05/word-image-3314.png 1024w, /wp-content/uploads/2018/05/word-image-3314-300x173.png 300w, /wp-content/uploads/2018/05/word-image-3314-768x443.png 768w" sizes="(max-width: 1024px) 100vw, 1024px" /><br />
<img loading="lazy" decoding="async" width="866" height="625" src="/wp-content/uploads/2018/05/word-image-3315.png" class="wp-image-3765" srcset="/wp-content/uploads/2018/05/word-image-3315.png 866w, /wp-content/uploads/2018/05/word-image-3315-300x217.png 300w, /wp-content/uploads/2018/05/word-image-3315-768x554.png 768w" sizes="(max-width: 866px) 100vw, 866px" /></p>
<p>
  查看现有的cookie内容
</p>
<p><img loading="lazy" decoding="async" width="651" height="186" src="/wp-content/uploads/2018/05/word-image-3316.png" class="wp-image-3766" srcset="/wp-content/uploads/2018/05/word-image-3316.png 651w, /wp-content/uploads/2018/05/word-image-3316-300x86.png 300w" sizes="(max-width: 651px) 100vw, 651px" /></p>
<p>
  设置cookie
</p>
<p><img loading="lazy" decoding="async" width="672" height="140" src="/wp-content/uploads/2018/05/word-image-3317.png" class="wp-image-3767" srcset="/wp-content/uploads/2018/05/word-image-3317.png 672w, /wp-content/uploads/2018/05/word-image-3317-300x63.png 300w" sizes="(max-width: 672px) 100vw, 672px" /></p>
<p>
  再次查看结果
</p>
<p><img loading="lazy" decoding="async" width="723" height="251" src="/wp-content/uploads/2018/05/word-image-3318.png" class="wp-image-3769" srcset="/wp-content/uploads/2018/05/word-image-3318.png 723w, /wp-content/uploads/2018/05/word-image-3318-300x104.png 300w" sizes="(max-width: 723px) 100vw, 723px" /></p>
<p>
  删除cookie
</p>
<p><img loading="lazy" decoding="async" width="651" height="179" src="/wp-content/uploads/2018/05/word-image-3319.png" class="wp-image-3770" srcset="/wp-content/uploads/2018/05/word-image-3319.png 651w, /wp-content/uploads/2018/05/word-image-3319-300x82.png 300w" sizes="(max-width: 651px) 100vw, 651px" /></p>
<p>
  再次查看cookie中的内容
</p>
<p><img loading="lazy" decoding="async" width="727" height="228" src="/wp-content/uploads/2018/05/word-image-3320.png" class="wp-image-3771" srcset="/wp-content/uploads/2018/05/word-image-3320.png 727w, /wp-content/uploads/2018/05/word-image-3320-300x94.png 300w" sizes="(max-width: 727px) 100vw, 727px" /></p>
<h1>验证码</h1>
<p>
  使用验证码一定注意PHP环境当中的gd库的扩展是否开启，并且需要注意到验证码功能是否能够正常使用
</p>
<p>
  TP验证码源码位置：ThinkPHP\Library\Think\Verify.class.php
</p>
<p>
  使用方式：直接实例化类对象调用方法即可
</p>
<h2>3.1、验证码基本使用</h2>
<p><img loading="lazy" decoding="async" width="998" height="396" src="/wp-content/uploads/2018/05/word-image-3321.png" class="wp-image-3772" srcset="/wp-content/uploads/2018/05/word-image-3321.png 998w, /wp-content/uploads/2018/05/word-image-3321-300x119.png 300w, /wp-content/uploads/2018/05/word-image-3321-768x305.png 768w" sizes="(max-width: 998px) 100vw, 998px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="966" height="487" src="/wp-content/uploads/2018/05/word-image-3322.png" class="wp-image-3773" srcset="/wp-content/uploads/2018/05/word-image-3322.png 966w, /wp-content/uploads/2018/05/word-image-3322-300x151.png 300w, /wp-content/uploads/2018/05/word-image-3322-768x387.png 768w" sizes="(max-width: 966px) 100vw, 966px" /></p>
<h2>3.2、查看验证码使用方式</h2>
<p>
  ①查看验证码类的属性配置
</p>
<p><img loading="lazy" decoding="async" width="1064" height="678" src="/wp-content/uploads/2018/05/word-image-3323.png" class="wp-image-3774" srcset="/wp-content/uploads/2018/05/word-image-3323.png 1064w, /wp-content/uploads/2018/05/word-image-3323-300x191.png 300w, /wp-content/uploads/2018/05/word-image-3323-768x489.png 768w, /wp-content/uploads/2018/05/word-image-3323-1024x653.png 1024w" sizes="(max-width: 1064px) 100vw, 1064px" /></p>
<p>
  ②查看构造方法的使用
</p>
<p><img loading="lazy" decoding="async" width="1090" height="363" src="/wp-content/uploads/2018/05/word-image-3324.png" class="wp-image-3775" srcset="/wp-content/uploads/2018/05/word-image-3324.png 1090w, /wp-content/uploads/2018/05/word-image-3324-300x100.png 300w, /wp-content/uploads/2018/05/word-image-3324-768x256.png 768w, /wp-content/uploads/2018/05/word-image-3324-1024x341.png 1024w" sizes="(max-width: 1090px) 100vw, 1090px" /></p>
<p>
  ③查看check方法
</p>
<p><img loading="lazy" decoding="async" width="1029" height="666" src="/wp-content/uploads/2018/05/word-image-3325.png" class="wp-image-3776" srcset="/wp-content/uploads/2018/05/word-image-3325.png 1029w, /wp-content/uploads/2018/05/word-image-3325-300x194.png 300w, /wp-content/uploads/2018/05/word-image-3325-768x497.png 768w, /wp-content/uploads/2018/05/word-image-3325-1024x663.png 1024w" sizes="(max-width: 1029px) 100vw, 1029px" /></p>
<p>
  ④查看生产验证码的方法
</p>
<p><img loading="lazy" decoding="async" width="1112" height="658" src="/wp-content/uploads/2018/05/word-image-3326.png" class="wp-image-3777" srcset="/wp-content/uploads/2018/05/word-image-3326.png 1112w, /wp-content/uploads/2018/05/word-image-3326-300x178.png 300w, /wp-content/uploads/2018/05/word-image-3326-768x454.png 768w, /wp-content/uploads/2018/05/word-image-3326-1024x606.png 1024w" sizes="(max-width: 1112px) 100vw, 1112px" /></p>
<h2>3.3、生产验证码并且校验</h2>
<p><img loading="lazy" decoding="async" width="1037" height="691" src="/wp-content/uploads/2018/05/word-image-3327.png" class="wp-image-3778" srcset="/wp-content/uploads/2018/05/word-image-3327.png 1037w, /wp-content/uploads/2018/05/word-image-3327-300x200.png 300w, /wp-content/uploads/2018/05/word-image-3327-768x512.png 768w, /wp-content/uploads/2018/05/word-image-3327-1024x682.png 1024w" sizes="(max-width: 1037px) 100vw, 1037px" /></p>
<p>
  效果如下
</p>
<p>
  生产验证码
</p>
<p><img loading="lazy" decoding="async" width="950" height="408" src="/wp-content/uploads/2018/05/word-image-3328.png" class="wp-image-3779" srcset="/wp-content/uploads/2018/05/word-image-3328.png 950w, /wp-content/uploads/2018/05/word-image-3328-300x129.png 300w, /wp-content/uploads/2018/05/word-image-3328-768x330.png 768w" sizes="(max-width: 950px) 100vw, 950px" /></p>
<p>
  比对验证码
</p>
<p><img loading="lazy" decoding="async" width="904" height="150" src="/wp-content/uploads/2018/05/word-image-3329.png" class="wp-image-3780" srcset="/wp-content/uploads/2018/05/word-image-3329.png 904w, /wp-content/uploads/2018/05/word-image-3329-300x50.png 300w, /wp-content/uploads/2018/05/word-image-3329-768x127.png 768w" sizes="(max-width: 904px) 100vw, 904px" /></p>
<h1>数据分页</h1>
<h2>4.1、分页实现方式</h2>
<ol>
<li>
  计算总的记录数
</li>
<li>
  设置每一页多少条数据
</li>
<li>
  获取当前的页码
</li>
<li>
  根据当前的页码获取对应的数据本质就是处理limit
</li>
<li>
  计算出分页的导航信息
</li>
</ol>
<h2>4.2、查看分页类的使用方式</h2>
<p>
  关于分页类的源码地址：ThinkPHP\Library\Think\page.class.php
</p>
<p>
  ①查看配置信息
</p>
<p><img loading="lazy" decoding="async" width="1058" height="664" src="/wp-content/uploads/2018/05/word-image-3330.png" class="wp-image-3781" srcset="/wp-content/uploads/2018/05/word-image-3330.png 1058w, /wp-content/uploads/2018/05/word-image-3330-300x188.png 300w, /wp-content/uploads/2018/05/word-image-3330-768x482.png 768w, /wp-content/uploads/2018/05/word-image-3330-1024x643.png 1024w" sizes="(max-width: 1058px) 100vw, 1058px" /></p>
<p>
  ②构造方法
</p>
<p><img loading="lazy" decoding="async" width="1166" height="678" src="/wp-content/uploads/2018/05/word-image-3331.png" class="wp-image-3782" srcset="/wp-content/uploads/2018/05/word-image-3331.png 1166w, /wp-content/uploads/2018/05/word-image-3331-300x174.png 300w, /wp-content/uploads/2018/05/word-image-3331-768x447.png 768w, /wp-content/uploads/2018/05/word-image-3331-1024x595.png 1024w" sizes="(max-width: 1166px) 100vw, 1166px" /></p>
<p>
  ③查看show方法
</p>
<p><img loading="lazy" decoding="async" width="1029" height="640" src="/wp-content/uploads/2018/05/word-image-3332.png" class="wp-image-3783" srcset="/wp-content/uploads/2018/05/word-image-3332.png 1029w, /wp-content/uploads/2018/05/word-image-3332-300x187.png 300w, /wp-content/uploads/2018/05/word-image-3332-768x478.png 768w, /wp-content/uploads/2018/05/word-image-3332-1024x637.png 1024w" sizes="(max-width: 1029px) 100vw, 1029px" /></p>
<h2>4.3、使用分类</h2>
<p>
  ①创建方法
</p>
<p><img loading="lazy" decoding="async" width="1054" height="690" src="/wp-content/uploads/2018/05/word-image-3333.png" class="wp-image-3784" srcset="/wp-content/uploads/2018/05/word-image-3333.png 1054w, /wp-content/uploads/2018/05/word-image-3333-300x196.png 300w, /wp-content/uploads/2018/05/word-image-3333-768x503.png 768w, /wp-content/uploads/2018/05/word-image-3333-1024x670.png 1024w" sizes="(max-width: 1054px) 100vw, 1054px" /></p>
<p>
  ②处理模板
</p>
<p><img loading="lazy" decoding="async" width="1025" height="656" src="/wp-content/uploads/2018/05/word-image-3334.png" class="wp-image-3785" srcset="/wp-content/uploads/2018/05/word-image-3334.png 1025w, /wp-content/uploads/2018/05/word-image-3334-300x192.png 300w, /wp-content/uploads/2018/05/word-image-3334-768x492.png 768w, /wp-content/uploads/2018/05/word-image-3334-1024x655.png 1024w" sizes="(max-width: 1025px) 100vw, 1025px" /></p>
<p>
  ③效果如下
</p>
<p><img loading="lazy" decoding="async" width="685" height="246" src="/wp-content/uploads/2018/05/word-image-3335.png" class="wp-image-3786" srcset="/wp-content/uploads/2018/05/word-image-3335.png 685w, /wp-content/uploads/2018/05/word-image-3335-300x108.png 300w" sizes="(max-width: 685px) 100vw, 685px" /></p>
<h1>5、案例-电商后台登录</h1>
<h2>5.1、分析实现过程</h2>
<ol>
<li>
  创建控制器方法显示登录界面
</li>
<li>
  需要显示出验证码
</li>
<li>
  用户提交数据、接受并且比对(1、比对验证码2、比对用户名3、比对密码)
</li>
<li>
  登录完成，保存用户的登录状态(session或者cookie)。需要跳转到后台首页
</li>
<li>
  防止直接翻墙
</li>
</ol>
<h2>5.2、显示登录到的界面</h2>
<h3>5.1.1、显示登录页</h3>
<p>
  ①创建控制器方法加载模板
</p>
<p><img loading="lazy" decoding="async" width="898" height="629" src="/wp-content/uploads/2018/05/word-image-3336.png" class="wp-image-3787" srcset="/wp-content/uploads/2018/05/word-image-3336.png 898w, /wp-content/uploads/2018/05/word-image-3336-300x210.png 300w, /wp-content/uploads/2018/05/word-image-3336-768x538.png 768w" sizes="(max-width: 898px) 100vw, 898px" /></p>
<p>
  ②拷贝登录模板
</p>
<p><img loading="lazy" decoding="async" width="1284" height="484" src="/wp-content/uploads/2018/05/word-image-3337.png" class="wp-image-3788" srcset="/wp-content/uploads/2018/05/word-image-3337.png 1284w, /wp-content/uploads/2018/05/word-image-3337-300x113.png 300w, /wp-content/uploads/2018/05/word-image-3337-768x289.png 768w, /wp-content/uploads/2018/05/word-image-3337-1024x386.png 1024w" sizes="(max-width: 1284px) 100vw, 1284px" /></p>
<p>
  ③修改登录模板的资源地址
</p>
<p><img loading="lazy" decoding="async" width="1050" height="687" src="/wp-content/uploads/2018/05/word-image-3338.png" class="wp-image-3789" srcset="/wp-content/uploads/2018/05/word-image-3338.png 1050w, /wp-content/uploads/2018/05/word-image-3338-300x196.png 300w, /wp-content/uploads/2018/05/word-image-3338-768x502.png 768w, /wp-content/uploads/2018/05/word-image-3338-1024x670.png 1024w" sizes="(max-width: 1050px) 100vw, 1050px" /></p>
<h3>5.1.2、显示验证码</h3>
<p>
  ①修改模板使用验证码
</p>
<p><img loading="lazy" decoding="async" width="1094" height="616" src="/wp-content/uploads/2018/05/word-image-3339.png" class="wp-image-3790" srcset="/wp-content/uploads/2018/05/word-image-3339.png 1094w, /wp-content/uploads/2018/05/word-image-3339-300x169.png 300w, /wp-content/uploads/2018/05/word-image-3339-768x432.png 768w, /wp-content/uploads/2018/05/word-image-3339-1024x577.png 1024w" sizes="(max-width: 1094px) 100vw, 1094px" /></p>
<p>
  ②创建方法生成验证码
</p>
<p><img loading="lazy" decoding="async" width="849" height="442" src="/wp-content/uploads/2018/05/word-image-3340.png" class="wp-image-3791" srcset="/wp-content/uploads/2018/05/word-image-3340.png 849w, /wp-content/uploads/2018/05/word-image-3340-300x156.png 300w, /wp-content/uploads/2018/05/word-image-3340-768x400.png 768w" sizes="(max-width: 849px) 100vw, 849px" /></p>
<p>
  ③修改模板引入jQuery
</p>
<p><img loading="lazy" decoding="async" width="938" height="513" src="/wp-content/uploads/2018/05/word-image-3341.png" class="wp-image-3792" srcset="/wp-content/uploads/2018/05/word-image-3341.png 938w, /wp-content/uploads/2018/05/word-image-3341-300x164.png 300w, /wp-content/uploads/2018/05/word-image-3341-768x420.png 768w" sizes="(max-width: 938px) 100vw, 938px" /></p>
<p>
  ④对验证码绑定点击事件
</p>
<p><img loading="lazy" decoding="async" width="1071" height="573" src="/wp-content/uploads/2018/05/word-image-3342.png" class="wp-image-3793" srcset="/wp-content/uploads/2018/05/word-image-3342.png 1071w, /wp-content/uploads/2018/05/word-image-3342-300x161.png 300w, /wp-content/uploads/2018/05/word-image-3342-768x411.png 768w, /wp-content/uploads/2018/05/word-image-3342-1024x548.png 1024w" sizes="(max-width: 1071px) 100vw, 1071px" /></p>
<h2>5.3、实现登录对比</h2>
<h3>5.3.1、创建数据表</h3>
<p><img loading="lazy" decoding="async" width="638" height="275" src="/wp-content/uploads/2018/05/word-image-3343.png" class="wp-image-3794" srcset="/wp-content/uploads/2018/05/word-image-3343.png 638w, /wp-content/uploads/2018/05/word-image-3343-300x129.png 300w" sizes="(max-width: 638px) 100vw, 638px" /></p>
<h3>5.3.2、添加测试账户</h3>
<p>
  ①创建生成密码的函数
</p>
<p>
  由于增加测试用户时不能确定密码。需要用代码生成密码。由于后期会经常使用该方式进行密码校验等处理。因此封装成为函数
</p>
<p><img loading="lazy" decoding="async" width="1009" height="555" src="/wp-content/uploads/2018/05/word-image-3344.png" class="wp-image-3795" srcset="/wp-content/uploads/2018/05/word-image-3344.png 1009w, /wp-content/uploads/2018/05/word-image-3344-300x165.png 300w, /wp-content/uploads/2018/05/word-image-3344-768x422.png 768w" sizes="(max-width: 1009px) 100vw, 1009px" /></p>
<p>
  ③创建一个测试方法生成密码
</p>
<p><img loading="lazy" decoding="async" width="905" height="487" src="/wp-content/uploads/2018/05/word-image-3345.png" class="wp-image-3796" srcset="/wp-content/uploads/2018/05/word-image-3345.png 905w, /wp-content/uploads/2018/05/word-image-3345-300x161.png 300w, /wp-content/uploads/2018/05/word-image-3345-768x413.png 768w" sizes="(max-width: 905px) 100vw, 905px" /></p>
<p>
  ④访问测试方法生成密码
</p>
<p><img loading="lazy" decoding="async" width="542" height="108" src="/wp-content/uploads/2018/05/word-image-3346.png" class="wp-image-3797" srcset="/wp-content/uploads/2018/05/word-image-3346.png 542w, /wp-content/uploads/2018/05/word-image-3346-300x60.png 300w" sizes="(max-width: 542px) 100vw, 542px" /></p>
<p>
  ⑤根据生产的密码写入测试账户
</p>
<p><img loading="lazy" decoding="async" width="1116" height="394" src="/wp-content/uploads/2018/05/word-image-3347.png" class="wp-image-3798" srcset="/wp-content/uploads/2018/05/word-image-3347.png 1116w, /wp-content/uploads/2018/05/word-image-3347-300x106.png 300w, /wp-content/uploads/2018/05/word-image-3347-768x271.png 768w, /wp-content/uploads/2018/05/word-image-3347-1024x362.png 1024w" sizes="(max-width: 1116px) 100vw, 1116px" /></p>
<h3>5.3.3、创建模型</h3>
<p>
  ①创建自定义的模型
</p>
<p><img loading="lazy" decoding="async" width="803" height="548" src="/wp-content/uploads/2018/05/word-image-3348.png" class="wp-image-3799" srcset="/wp-content/uploads/2018/05/word-image-3348.png 803w, /wp-content/uploads/2018/05/word-image-3348-300x205.png 300w, /wp-content/uploads/2018/05/word-image-3348-768x524.png 768w, /wp-content/uploads/2018/05/word-image-3348-220x150.png 220w" sizes="(max-width: 803px) 100vw, 803px" /></p>
<p>
  ②定义字段信息
</p>
<p><img loading="lazy" decoding="async" width="1046" height="585" src="/wp-content/uploads/2018/05/word-image-3349.png" class="wp-image-3800" srcset="/wp-content/uploads/2018/05/word-image-3349.png 1046w, /wp-content/uploads/2018/05/word-image-3349-300x168.png 300w, /wp-content/uploads/2018/05/word-image-3349-768x430.png 768w, /wp-content/uploads/2018/05/word-image-3349-1024x573.png 1024w" sizes="(max-width: 1046px) 100vw, 1046px" /></p>
<p>
  ③定义字段映射
</p>
<p><img loading="lazy" decoding="async" width="1028" height="665" src="/wp-content/uploads/2018/05/word-image-3350.png" class="wp-image-3801" srcset="/wp-content/uploads/2018/05/word-image-3350.png 1028w, /wp-content/uploads/2018/05/word-image-3350-300x194.png 300w, /wp-content/uploads/2018/05/word-image-3350-768x497.png 768w, /wp-content/uploads/2018/05/word-image-3350-1024x662.png 1024w" sizes="(max-width: 1028px) 100vw, 1028px" /></p>
<p>
  ④修改模板使用假名
</p>
<p><img loading="lazy" decoding="async" width="1060" height="595" src="/wp-content/uploads/2018/05/word-image-3351.png" class="wp-image-3802" srcset="/wp-content/uploads/2018/05/word-image-3351.png 1060w, /wp-content/uploads/2018/05/word-image-3351-300x168.png 300w, /wp-content/uploads/2018/05/word-image-3351-768x431.png 768w, /wp-content/uploads/2018/05/word-image-3351-1024x575.png 1024w" sizes="(max-width: 1060px) 100vw, 1060px" /></p>
<p>
  ⑤编写自动验证规则
</p>
<p><img loading="lazy" decoding="async" width="1007" height="645" src="/wp-content/uploads/2018/05/word-image-3352.png" class="wp-image-3803" srcset="/wp-content/uploads/2018/05/word-image-3352.png 1007w, /wp-content/uploads/2018/05/word-image-3352-300x192.png 300w, /wp-content/uploads/2018/05/word-image-3352-768x492.png 768w" sizes="(max-width: 1007px) 100vw, 1007px" /></p>
<h3>5.3.4、控制器调用方法进行对比</h3>
<p>
  ①修改控制器login方法
</p>
<p><img loading="lazy" decoding="async" width="1070" height="699" src="/wp-content/uploads/2018/05/word-image-3353.png" class="wp-image-3804" srcset="/wp-content/uploads/2018/05/word-image-3353.png 1070w, /wp-content/uploads/2018/05/word-image-3353-300x196.png 300w, /wp-content/uploads/2018/05/word-image-3353-768x502.png 768w, /wp-content/uploads/2018/05/word-image-3353-1024x669.png 1024w" sizes="(max-width: 1070px) 100vw, 1070px" /></p>
<p>
  ②创建模型方法实现登录
</p>
<p><img loading="lazy" decoding="async" width="1087" height="701" src="/wp-content/uploads/2018/05/word-image-3354.png" class="wp-image-3805" srcset="/wp-content/uploads/2018/05/word-image-3354.png 1087w, /wp-content/uploads/2018/05/word-image-3354-300x193.png 300w, /wp-content/uploads/2018/05/word-image-3354-768x495.png 768w, /wp-content/uploads/2018/05/word-image-3354-1024x660.png 1024w" sizes="(max-width: 1087px) 100vw, 1087px" /><br />
<img loading="lazy" decoding="async" width="1076" height="589" src="/wp-content/uploads/2018/05/word-image-3355.png" class="wp-image-3806" srcset="/wp-content/uploads/2018/05/word-image-3355.png 1076w, /wp-content/uploads/2018/05/word-image-3355-300x164.png 300w, /wp-content/uploads/2018/05/word-image-3355-768x420.png 768w, /wp-content/uploads/2018/05/word-image-3355-1024x561.png 1024w" sizes="(max-width: 1076px) 100vw, 1076px" /></p>
<h3>5.3.5、控制翻墙</h3>
<p>
  ①在后台首页中的index方法进行判断
</p>
<p><img loading="lazy" decoding="async" width="975" height="574" src="/wp-content/uploads/2018/05/word-image-3356.png" class="wp-image-3807" srcset="/wp-content/uploads/2018/05/word-image-3356.png 975w, /wp-content/uploads/2018/05/word-image-3356-300x177.png 300w, /wp-content/uploads/2018/05/word-image-3356-768x452.png 768w" sizes="(max-width: 975px) 100vw, 975px" /></p>
<p>
  对于此方式，由于后台中除了登录之外。其他的都需要进行是否登录判断。此方式不合理。可以在创建一个公共控制器在构造方法中进行验证。对于除了登录控制器之外其他的控制器都继承公共控制器
</p>
<p>
  ②创建公共控制器
</p>
<p><img loading="lazy" decoding="async" width="1043" height="703" src="/wp-content/uploads/2018/05/word-image-3357.png" class="wp-image-3808" srcset="/wp-content/uploads/2018/05/word-image-3357.png 1043w, /wp-content/uploads/2018/05/word-image-3357-300x202.png 300w, /wp-content/uploads/2018/05/word-image-3357-768x518.png 768w, /wp-content/uploads/2018/05/word-image-3357-1024x690.png 1024w" sizes="(max-width: 1043px) 100vw, 1043px" /></p>
<p>
  ③修改Index控制器的继承关系
</p>
<p><img loading="lazy" decoding="async" width="898" height="474" src="/wp-content/uploads/2018/05/word-image-3358.png" class="wp-image-3809" srcset="/wp-content/uploads/2018/05/word-image-3358.png 898w, /wp-content/uploads/2018/05/word-image-3358-300x158.png 300w, /wp-content/uploads/2018/05/word-image-3358-768x405.png 768w" sizes="(max-width: 898px) 100vw, 898px" /></p>
<p>
  可能common控制器中有很多公共方法，对于登录有可能会使用到。需要修改login继承common控制器。但是直接继承会出现故障
</p>
<p>
  ④修改Login控制器的继承关系
</p>
<p><img loading="lazy" decoding="async" width="896" height="497" src="/wp-content/uploads/2018/05/word-image-3359.png" class="wp-image-3810" srcset="/wp-content/uploads/2018/05/word-image-3359.png 896w, /wp-content/uploads/2018/05/word-image-3359-300x166.png 300w, /wp-content/uploads/2018/05/word-image-3359-768x426.png 768w" sizes="(max-width: 896px) 100vw, 896px" /></p>
<p>
  ⑤修改公共\\
</p>
<p><img loading="lazy" decoding="async" width="981" height="695" src="/wp-content/uploads/2018/05/word-image-3360.png" class="wp-image-3811" srcset="/wp-content/uploads/2018/05/word-image-3360.png 981w, /wp-content/uploads/2018/05/word-image-3360-300x213.png 300w, /wp-content/uploads/2018/05/word-image-3360-768x544.png 768w" sizes="(max-width: 981px) 100vw, 981px" /></p>
<h2>5.4、实现退出登录</h2>
<p>
  ①修改模板连接地址
</p>
<p><img loading="lazy" decoding="async" width="1064" height="400" src="/wp-content/uploads/2018/05/word-image-3361.png" class="wp-image-3812" srcset="/wp-content/uploads/2018/05/word-image-3361.png 1064w, /wp-content/uploads/2018/05/word-image-3361-300x113.png 300w, /wp-content/uploads/2018/05/word-image-3361-768x289.png 768w, /wp-content/uploads/2018/05/word-image-3361-1024x385.png 1024w" sizes="(max-width: 1064px) 100vw, 1064px" /></p>
<p>
  ②创建退出的方法
</p>
<p><img loading="lazy" decoding="async" width="970" height="424" src="/wp-content/uploads/2018/05/word-image-3362.png" class="wp-image-3813" srcset="/wp-content/uploads/2018/05/word-image-3362.png 970w, /wp-content/uploads/2018/05/word-image-3362-300x131.png 300w, /wp-content/uploads/2018/05/word-image-3362-768x336.png 768w" sizes="(max-width: 970px) 100vw, 970px" /></p>
]]></content:encoded>
					
					<wfw:commentRss>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/3732.html/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>TP3.2商城 （一）项目开发流程、商品分类、商品管理、图片上传</title>
		<link>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4706.html</link>
					<comments>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4706.html#respond</comments>
		
		<dc:creator><![CDATA[Mr.Lee]]></dc:creator>
		<pubDate>Sat, 19 May 2018 13:04:55 +0000</pubDate>
				<category><![CDATA[TP3.2]]></category>
		<category><![CDATA[TP3.2商城]]></category>
		<category><![CDATA[后台框架]]></category>
		<category><![CDATA[商品分类]]></category>
		<category><![CDATA[商品管理]]></category>
		<category><![CDATA[图片上传]]></category>
		<category><![CDATA[项目开发流程]]></category>
		<guid isPermaLink="false">/?p=4706</guid>

					<description><![CDATA[项目开发流程; 需求分析 原型界面 UI设计 前端编写代码 核心架构处理(代码层面核心架构，服务器层面的架构、 [&#8230;]]]></description>
										<content:encoded><![CDATA[<h1>项目开发流程;</h1>
<ol>
<li>
  需求分析
</li>
<li>
  原型界面
</li>
<li>
  UI设计
</li>
<li>
  前端编写代码
</li>
<li>
  核心架构处理(代码层面核心架构，服务器层面的架构、数据库的架构等)
</li>
<li>
  编写代码
</li>
<li>
  测试
</li>
<li>
  上线
</li>
</ol>
<h1>项目分析</h1>
<h2>2.1、项目前台分析</h2>
<p><img loading="lazy" decoding="async" width="992" height="448" src="/wp-content/uploads/2018/05/word-image-4231.png" class="wp-image-4707" srcset="/wp-content/uploads/2018/05/word-image-4231.png 992w, /wp-content/uploads/2018/05/word-image-4231-300x135.png 300w, /wp-content/uploads/2018/05/word-image-4231-768x347.png 768w" sizes="(max-width: 992px) 100vw, 992px" /></p>
<h2>2.2、项目后台分析</h2>
<p><img loading="lazy" decoding="async" width="900" height="469" src="/wp-content/uploads/2018/05/word-image-4232.png" class="wp-image-4708" srcset="/wp-content/uploads/2018/05/word-image-4232.png 900w, /wp-content/uploads/2018/05/word-image-4232-300x156.png 300w, /wp-content/uploads/2018/05/word-image-4232-768x400.png 768w" sizes="(max-width: 900px) 100vw, 900px" /></p>
<h1>ecshop安装</h1>
<h2>3.1、ecshop的配置</h2>
<p>
  ①创建ecshop的web目录
</p>
<p><img loading="lazy" decoding="async" width="828" height="226" src="/wp-content/uploads/2018/05/word-image-4233.png" class="wp-image-4709" srcset="/wp-content/uploads/2018/05/word-image-4233.png 828w, /wp-content/uploads/2018/05/word-image-4233-300x82.png 300w, /wp-content/uploads/2018/05/word-image-4233-768x210.png 768w" sizes="(max-width: 828px) 100vw, 828px" /></p>
<p>
  ②拷贝ecshop的源码
</p>
<p><img loading="lazy" decoding="async" width="1218" height="593" src="/wp-content/uploads/2018/05/word-image-4234.png" class="wp-image-4710" srcset="/wp-content/uploads/2018/05/word-image-4234.png 1218w, /wp-content/uploads/2018/05/word-image-4234-300x146.png 300w, /wp-content/uploads/2018/05/word-image-4234-768x374.png 768w, /wp-content/uploads/2018/05/word-image-4234-1024x499.png 1024w" sizes="(max-width: 1218px) 100vw, 1218px" /></p>
<p>
  ③创建虚拟主机
</p>
<p><img loading="lazy" decoding="async" width="1030" height="383" src="/wp-content/uploads/2018/05/word-image-4235.png" class="wp-image-4711" srcset="/wp-content/uploads/2018/05/word-image-4235.png 1030w, /wp-content/uploads/2018/05/word-image-4235-300x112.png 300w, /wp-content/uploads/2018/05/word-image-4235-768x286.png 768w, /wp-content/uploads/2018/05/word-image-4235-1024x381.png 1024w" sizes="(max-width: 1030px) 100vw, 1030px" /></p>
<p>
  ④修改hosts文件
</p>
<p><img loading="lazy" decoding="async" width="615" height="433" src="/wp-content/uploads/2018/05/word-image-4236.png" class="wp-image-4712" srcset="/wp-content/uploads/2018/05/word-image-4236.png 615w, /wp-content/uploads/2018/05/word-image-4236-300x211.png 300w" sizes="(max-width: 615px) 100vw, 615px" /></p>
<h2>3.2、安装ecshop</h2>
<p>
  ①重启Apache访问安装
</p>
<p><img loading="lazy" decoding="async" width="1253" height="689" src="/wp-content/uploads/2018/05/word-image-4237.png" class="wp-image-4713" srcset="/wp-content/uploads/2018/05/word-image-4237.png 1253w, /wp-content/uploads/2018/05/word-image-4237-300x165.png 300w, /wp-content/uploads/2018/05/word-image-4237-768x422.png 768w, /wp-content/uploads/2018/05/word-image-4237-1024x563.png 1024w" sizes="(max-width: 1253px) 100vw, 1253px" /></p>
<p>
  ②检查环境
</p>
<p><img loading="lazy" decoding="async" width="1198" height="670" src="/wp-content/uploads/2018/05/word-image-4238.png" class="wp-image-4714" srcset="/wp-content/uploads/2018/05/word-image-4238.png 1198w, /wp-content/uploads/2018/05/word-image-4238-300x168.png 300w, /wp-content/uploads/2018/05/word-image-4238-768x430.png 768w, /wp-content/uploads/2018/05/word-image-4238-1024x573.png 1024w" sizes="(max-width: 1198px) 100vw, 1198px" /></p>
<p>
  ③配置信息
</p>
<p><img loading="lazy" decoding="async" width="1195" height="693" src="/wp-content/uploads/2018/05/word-image-4239.png" class="wp-image-4715" srcset="/wp-content/uploads/2018/05/word-image-4239.png 1195w, /wp-content/uploads/2018/05/word-image-4239-300x174.png 300w, /wp-content/uploads/2018/05/word-image-4239-768x445.png 768w, /wp-content/uploads/2018/05/word-image-4239-1024x594.png 1024w" sizes="(max-width: 1195px) 100vw, 1195px" /></p>
<p>
  ④登录后台
</p>
<p><img loading="lazy" decoding="async" width="1115" height="616" src="/wp-content/uploads/2018/05/word-image-4240.png" class="wp-image-4716" srcset="/wp-content/uploads/2018/05/word-image-4240.png 1115w, /wp-content/uploads/2018/05/word-image-4240-300x166.png 300w, /wp-content/uploads/2018/05/word-image-4240-768x424.png 768w, /wp-content/uploads/2018/05/word-image-4240-1024x566.png 1024w" sizes="(max-width: 1115px) 100vw, 1115px" /></p>
<h2>3.3、解决报错问题</h2>
<p>
  ①修改includes目录下的cls_template.php文件
</p>
<p><img loading="lazy" decoding="async" width="867" height="559" src="/wp-content/uploads/2018/05/word-image-4241.png" class="wp-image-4717" srcset="/wp-content/uploads/2018/05/word-image-4241.png 867w, /wp-content/uploads/2018/05/word-image-4241-300x193.png 300w, /wp-content/uploads/2018/05/word-image-4241-768x495.png 768w" sizes="(max-width: 867px) 100vw, 867px" /></p>
<p>
  ②修改cls_image.php文件
</p>
<p><img loading="lazy" decoding="async" width="880" height="533" src="/wp-content/uploads/2018/05/word-image-4242.png" class="wp-image-4718" srcset="/wp-content/uploads/2018/05/word-image-4242.png 880w, /wp-content/uploads/2018/05/word-image-4242-300x182.png 300w, /wp-content/uploads/2018/05/word-image-4242-768x465.png 768w" sizes="(max-width: 880px) 100vw, 880px" /></p>
<p>
  ③修改lib_main.php
</p>
<p><img loading="lazy" decoding="async" width="911" height="533" src="/wp-content/uploads/2018/05/word-image-4243.png" class="wp-image-4719" srcset="/wp-content/uploads/2018/05/word-image-4243.png 911w, /wp-content/uploads/2018/05/word-image-4243-300x176.png 300w, /wp-content/uploads/2018/05/word-image-4243-768x449.png 768w" sizes="(max-width: 911px) 100vw, 911px" /></p>
<p>
  ④清除缓存
</p>
<p><img loading="lazy" decoding="async" width="1366" height="165" src="/wp-content/uploads/2018/05/word-image-4244.png" class="wp-image-4720" srcset="/wp-content/uploads/2018/05/word-image-4244.png 1366w, /wp-content/uploads/2018/05/word-image-4244-300x36.png 300w, /wp-content/uploads/2018/05/word-image-4244-768x93.png 768w, /wp-content/uploads/2018/05/word-image-4244-1024x124.png 1024w" sizes="(max-width: 1366px) 100vw, 1366px" /></p>
<h1>商品分类管理</h1>
<h2>4.1、商品分类列表显示</h2>
<p>
  ①增加index方法获取数据并且渲染模板
</p>
<p><img loading="lazy" decoding="async" width="938" height="474" src="/wp-content/uploads/2018/05/word-image-4245.png" class="wp-image-4721" srcset="/wp-content/uploads/2018/05/word-image-4245.png 938w, /wp-content/uploads/2018/05/word-image-4245-300x152.png 300w, /wp-content/uploads/2018/05/word-image-4245-768x388.png 768w" sizes="(max-width: 938px) 100vw, 938px" /></p>
<p>
  ②拷贝视图
</p>
<p><img loading="lazy" decoding="async" width="1232" height="325" src="/wp-content/uploads/2018/05/word-image-4246.png" class="wp-image-4722" srcset="/wp-content/uploads/2018/05/word-image-4246.png 1232w, /wp-content/uploads/2018/05/word-image-4246-300x79.png 300w, /wp-content/uploads/2018/05/word-image-4246-768x203.png 768w, /wp-content/uploads/2018/05/word-image-4246-1024x270.png 1024w" sizes="(max-width: 1232px) 100vw, 1232px" /></p>
<p>
  ③修改资源地址
</p>
<p><img loading="lazy" decoding="async" width="1117" height="456" src="/wp-content/uploads/2018/05/word-image-4247.png" class="wp-image-4723" srcset="/wp-content/uploads/2018/05/word-image-4247.png 1117w, /wp-content/uploads/2018/05/word-image-4247-300x122.png 300w, /wp-content/uploads/2018/05/word-image-4247-768x314.png 768w, /wp-content/uploads/2018/05/word-image-4247-1024x418.png 1024w" sizes="(max-width: 1117px) 100vw, 1117px" /></p>
<p>
  ④修改模板循环显示数据
</p>
<p><img loading="lazy" decoding="async" width="1115" height="672" src="/wp-content/uploads/2018/05/word-image-4248.png" class="wp-image-4724" srcset="/wp-content/uploads/2018/05/word-image-4248.png 1115w, /wp-content/uploads/2018/05/word-image-4248-300x181.png 300w, /wp-content/uploads/2018/05/word-image-4248-768x463.png 768w, /wp-content/uploads/2018/05/word-image-4248-1024x617.png 1024w" sizes="(max-width: 1115px) 100vw, 1115px" /></p>
<h2>4.2、分类的删除</h2>
<p>
  ①创建方法调用模型方法进行删除
</p>
<p><img loading="lazy" decoding="async" width="958" height="702" src="/wp-content/uploads/2018/05/word-image-4249.png" class="wp-image-4725" srcset="/wp-content/uploads/2018/05/word-image-4249.png 958w, /wp-content/uploads/2018/05/word-image-4249-300x220.png 300w, /wp-content/uploads/2018/05/word-image-4249-768x563.png 768w" sizes="(max-width: 958px) 100vw, 958px" /></p>
<p>
  ②在模型中实现删除方法
</p>
<p><img loading="lazy" decoding="async" width="1047" height="592" src="/wp-content/uploads/2018/05/word-image-4250.png" class="wp-image-4726" srcset="/wp-content/uploads/2018/05/word-image-4250.png 1047w, /wp-content/uploads/2018/05/word-image-4250-300x170.png 300w, /wp-content/uploads/2018/05/word-image-4250-768x434.png 768w, /wp-content/uploads/2018/05/word-image-4250-1024x579.png 1024w" sizes="(max-width: 1047px) 100vw, 1047px" /></p>
<h2>4.3、分类的编辑</h2>
<h3>4.3.1、回显分类信息</h3>
<p>
  ①创建方法获取数据并且显示
</p>
<p><img loading="lazy" decoding="async" width="1047" height="616" src="/wp-content/uploads/2018/05/word-image-4251.png" class="wp-image-4727" srcset="/wp-content/uploads/2018/05/word-image-4251.png 1047w, /wp-content/uploads/2018/05/word-image-4251-300x177.png 300w, /wp-content/uploads/2018/05/word-image-4251-768x452.png 768w, /wp-content/uploads/2018/05/word-image-4251-1024x602.png 1024w" sizes="(max-width: 1047px) 100vw, 1047px" /></p>
<p>
  ②拷贝添加模板为编辑模板
</p>
<p><img loading="lazy" decoding="async" width="865" height="283" src="/wp-content/uploads/2018/05/word-image-4252.png" class="wp-image-4728" srcset="/wp-content/uploads/2018/05/word-image-4252.png 865w, /wp-content/uploads/2018/05/word-image-4252-300x98.png 300w, /wp-content/uploads/2018/05/word-image-4252-768x251.png 768w" sizes="(max-width: 865px) 100vw, 865px" /></p>
<p>
  ③修改模板
</p>
<p><img loading="lazy" decoding="async" width="1160" height="699" src="/wp-content/uploads/2018/05/word-image-4253.png" class="wp-image-4729" srcset="/wp-content/uploads/2018/05/word-image-4253.png 1160w, /wp-content/uploads/2018/05/word-image-4253-300x181.png 300w, /wp-content/uploads/2018/05/word-image-4253-768x463.png 768w, /wp-content/uploads/2018/05/word-image-4253-1024x617.png 1024w" sizes="(max-width: 1160px) 100vw, 1160px" /></p>
<h3>4.3.2、实现提交修改</h3>
<p>
  ①修改edit方法处理提交
</p>
<p><img loading="lazy" decoding="async" width="977" height="585" src="/wp-content/uploads/2018/05/word-image-4254.png" class="wp-image-4730" srcset="/wp-content/uploads/2018/05/word-image-4254.png 977w, /wp-content/uploads/2018/05/word-image-4254-300x180.png 300w, /wp-content/uploads/2018/05/word-image-4254-768x460.png 768w" sizes="(max-width: 977px) 100vw, 977px" /></p>
<p>
  ②修改getTree方法可以根据id标识获取子分类
</p>
<p><img loading="lazy" decoding="async" width="1037" height="536" src="/wp-content/uploads/2018/05/word-image-4255.png" class="wp-image-4731" srcset="/wp-content/uploads/2018/05/word-image-4255.png 1037w, /wp-content/uploads/2018/05/word-image-4255-300x155.png 300w, /wp-content/uploads/2018/05/word-image-4255-768x397.png 768w, /wp-content/uploads/2018/05/word-image-4255-1024x529.png 1024w" sizes="(max-width: 1037px) 100vw, 1037px" /></p>
<p>
  ③模型增加方法实现修改
</p>
<p><img loading="lazy" decoding="async" width="1106" height="697" src="/wp-content/uploads/2018/05/word-image-4256.png" class="wp-image-4732" srcset="/wp-content/uploads/2018/05/word-image-4256.png 1106w, /wp-content/uploads/2018/05/word-image-4256-300x189.png 300w, /wp-content/uploads/2018/05/word-image-4256-768x484.png 768w, /wp-content/uploads/2018/05/word-image-4256-1024x645.png 1024w" sizes="(max-width: 1106px) 100vw, 1106px" /></p>
<h2>4.4、分类使用模板继承</h2>
<h3>4.4.1、介绍模板继承</h3>
<p>
  一个模板继承另外一个模板。在父模板中已有的HTML代码可以直接使用
</p>
<p><img loading="lazy" decoding="async" width="1046" height="635" src="/wp-content/uploads/2018/05/word-image-4257.png" class="wp-image-4733" srcset="/wp-content/uploads/2018/05/word-image-4257.png 1046w, /wp-content/uploads/2018/05/word-image-4257-300x182.png 300w, /wp-content/uploads/2018/05/word-image-4257-768x466.png 768w, /wp-content/uploads/2018/05/word-image-4257-1024x622.png 1024w" sizes="(max-width: 1046px) 100vw, 1046px" /></p>
<h3>4.4.2、使用模板继承</h3>
<p>
  ①定义父模板
</p>
<p><img loading="lazy" decoding="async" width="1119" height="669" src="/wp-content/uploads/2018/05/word-image-4258.png" class="wp-image-4734" srcset="/wp-content/uploads/2018/05/word-image-4258.png 1119w, /wp-content/uploads/2018/05/word-image-4258-300x179.png 300w, /wp-content/uploads/2018/05/word-image-4258-768x459.png 768w, /wp-content/uploads/2018/05/word-image-4258-1024x612.png 1024w" sizes="(max-width: 1119px) 100vw, 1119px" /><br />
<img loading="lazy" decoding="async" width="1096" height="498" src="/wp-content/uploads/2018/05/word-image-4259.png" class="wp-image-4735" srcset="/wp-content/uploads/2018/05/word-image-4259.png 1096w, /wp-content/uploads/2018/05/word-image-4259-300x136.png 300w, /wp-content/uploads/2018/05/word-image-4259-768x349.png 768w, /wp-content/uploads/2018/05/word-image-4259-1024x465.png 1024w" sizes="(max-width: 1096px) 100vw, 1096px" /></p>
<p>
  ②修改添加使用模板继承
</p>
<p><img loading="lazy" decoding="async" width="1101" height="616" src="/wp-content/uploads/2018/05/word-image-4260.png" class="wp-image-4736" srcset="/wp-content/uploads/2018/05/word-image-4260.png 1101w, /wp-content/uploads/2018/05/word-image-4260-300x168.png 300w, /wp-content/uploads/2018/05/word-image-4260-768x430.png 768w, /wp-content/uploads/2018/05/word-image-4260-1024x573.png 1024w" sizes="(max-width: 1101px) 100vw, 1101px" /><br />
<img loading="lazy" decoding="async" width="1080" height="512" src="/wp-content/uploads/2018/05/word-image-4261.png" class="wp-image-4737" srcset="/wp-content/uploads/2018/05/word-image-4261.png 1080w, /wp-content/uploads/2018/05/word-image-4261-300x142.png 300w, /wp-content/uploads/2018/05/word-image-4261-768x364.png 768w, /wp-content/uploads/2018/05/word-image-4261-1024x485.png 1024w" sizes="(max-width: 1080px) 100vw, 1080px" /></p>
<p>
  ③修改index使用模板继承
</p>
<p><img loading="lazy" decoding="async" width="953" height="342" src="/wp-content/uploads/2018/05/word-image-4262.png" class="wp-image-4738" srcset="/wp-content/uploads/2018/05/word-image-4262.png 953w, /wp-content/uploads/2018/05/word-image-4262-300x108.png 300w, /wp-content/uploads/2018/05/word-image-4262-768x276.png 768w" sizes="(max-width: 953px) 100vw, 953px" /></p>
<p>
  ④修改编辑模板使用模板继承
</p>
<p><img loading="lazy" decoding="async" width="1060" height="428" src="/wp-content/uploads/2018/05/word-image-4263.png" class="wp-image-4739" srcset="/wp-content/uploads/2018/05/word-image-4263.png 1060w, /wp-content/uploads/2018/05/word-image-4263-300x121.png 300w, /wp-content/uploads/2018/05/word-image-4263-768x310.png 768w, /wp-content/uploads/2018/05/word-image-4263-1024x413.png 1024w" sizes="(max-width: 1060px) 100vw, 1060px" /></p>
<h1>商品管理</h1>
<h2>5.1、商品数据表创建</h2>
<p>
  CREATE TABLE `shop_goods` (
</p>
<p>
    `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
</p>
<p>
    `goods_name` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;商品名称&#8217;,
</p>
<p>
    `goods_sn` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;货号&#8217;,
</p>
<p>
    `market_price` decimal(10,2) NOT NULL DEFAULT &#8216;0.00&#8217; COMMENT &#8216;市场价格&#8217;,
</p>
<p>
    `shop_price` decimal(10,2) NOT NULL DEFAULT &#8216;0.00&#8217; COMMENT &#8216;本店售价  单位元&#8217;,
</p>
<p>
    `goods_number` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;商品数量&#8217;,
</p>
<p>
    `cate_id` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;商品的分类ID 关联category表中id字段&#8217;,
</p>
<p>
    `goods_img` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;商品图片&#8217;,
</p>
<p>
    `goods_thumb` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;缩略图&#8217;,
</p>
<p>
    `goods_body` text,
</p>
<p>
    `addtime` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;添加时间&#8217;,
</p>
<p>
    `is_del` tinyint(4) NOT NULL DEFAULT &#8216;1&#8217; COMMENT &#8216;是否删除 1代表正常 0代表已经删除&#8217;,
</p>
<p>
    `is_hot` tinyint(4) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;是否热卖 1是 0否&#8217;,
</p>
<p>
    `is_new` tinyint(4) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;是否新品  1是0否&#8217;,
</p>
<p>
    `is_rec` tinyint(4) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;是否推荐  1是0否&#8217;,
</p>
<p>
    PRIMARY KEY (`id`)
</p>
<p>
  ) ENGINE=InnoDB DEFAULT CHARSET=utf8;
</p>
<h2>5.2、实现商品的基本入库</h2>
<h3>5.2.1、显示添加的界面</h3>
<p>
  ①创建控制器方法显示添加的模板
</p>
<p><img loading="lazy" decoding="async" width="964" height="550" src="/wp-content/uploads/2018/05/word-image-4264.png" class="wp-image-4740" srcset="/wp-content/uploads/2018/05/word-image-4264.png 964w, /wp-content/uploads/2018/05/word-image-4264-300x171.png 300w, /wp-content/uploads/2018/05/word-image-4264-768x438.png 768w" sizes="(max-width: 964px) 100vw, 964px" /></p>
<p>
  ②拷贝商品添加模板
</p>
<p><img loading="lazy" decoding="async" width="1158" height="435" src="/wp-content/uploads/2018/05/word-image-4265.png" class="wp-image-4741" srcset="/wp-content/uploads/2018/05/word-image-4265.png 1158w, /wp-content/uploads/2018/05/word-image-4265-300x113.png 300w, /wp-content/uploads/2018/05/word-image-4265-768x288.png 768w, /wp-content/uploads/2018/05/word-image-4265-1024x385.png 1024w" sizes="(max-width: 1158px) 100vw, 1158px" /></p>
<p>
  ③修改模板使用模板继承
</p>
<p><img loading="lazy" decoding="async" width="1113" height="496" src="/wp-content/uploads/2018/05/word-image-4266.png" class="wp-image-4742" srcset="/wp-content/uploads/2018/05/word-image-4266.png 1113w, /wp-content/uploads/2018/05/word-image-4266-300x134.png 300w, /wp-content/uploads/2018/05/word-image-4266-768x342.png 768w, /wp-content/uploads/2018/05/word-image-4266-1024x456.png 1024w" sizes="(max-width: 1113px) 100vw, 1113px" /></p>
<p>
  ④处理模板显示商品分类
</p>
<p><img loading="lazy" decoding="async" width="1125" height="699" src="/wp-content/uploads/2018/05/word-image-4267.png" class="wp-image-4743" srcset="/wp-content/uploads/2018/05/word-image-4267.png 1125w, /wp-content/uploads/2018/05/word-image-4267-300x186.png 300w, /wp-content/uploads/2018/05/word-image-4267-768x477.png 768w, /wp-content/uploads/2018/05/word-image-4267-1024x636.png 1024w" sizes="(max-width: 1125px) 100vw, 1125px" /><br />
<img loading="lazy" decoding="async" width="948" height="416" src="/wp-content/uploads/2018/05/word-image-4268.png" class="wp-image-4744" srcset="/wp-content/uploads/2018/05/word-image-4268.png 948w, /wp-content/uploads/2018/05/word-image-4268-300x132.png 300w, /wp-content/uploads/2018/05/word-image-4268-768x337.png 768w" sizes="(max-width: 948px) 100vw, 948px" /></p>
<h3>5.2.2、实现入库</h3>
<p>
  ①修改方法处理数据提交入库
</p>
<p><img loading="lazy" decoding="async" width="1092" height="703" src="/wp-content/uploads/2018/05/word-image-4269.png" class="wp-image-4745" srcset="/wp-content/uploads/2018/05/word-image-4269.png 1092w, /wp-content/uploads/2018/05/word-image-4269-300x193.png 300w, /wp-content/uploads/2018/05/word-image-4269-768x494.png 768w, /wp-content/uploads/2018/05/word-image-4269-1024x659.png 1024w" sizes="(max-width: 1092px) 100vw, 1092px" /></p>
<p>
  ②创建模型类
</p>
<p><img loading="lazy" decoding="async" width="780" height="473" src="/wp-content/uploads/2018/05/word-image-4270.png" class="wp-image-4746" srcset="/wp-content/uploads/2018/05/word-image-4270.png 780w, /wp-content/uploads/2018/05/word-image-4270-300x182.png 300w, /wp-content/uploads/2018/05/word-image-4270-768x466.png 768w" sizes="(max-width: 780px) 100vw, 780px" /></p>
<p>
  ③添加字段定义
</p>
<p><img loading="lazy" decoding="async" width="1098" height="539" src="/wp-content/uploads/2018/05/word-image-4271.png" class="wp-image-4747" srcset="/wp-content/uploads/2018/05/word-image-4271.png 1098w, /wp-content/uploads/2018/05/word-image-4271-300x147.png 300w, /wp-content/uploads/2018/05/word-image-4271-768x377.png 768w, /wp-content/uploads/2018/05/word-image-4271-1024x503.png 1024w" sizes="(max-width: 1098px) 100vw, 1098px" /></p>
<p>
  ④创建验证规则
</p>
<p><img loading="lazy" decoding="async" width="1064" height="640" src="/wp-content/uploads/2018/05/word-image-4272.png" class="wp-image-4748" srcset="/wp-content/uploads/2018/05/word-image-4272.png 1064w, /wp-content/uploads/2018/05/word-image-4272-300x180.png 300w, /wp-content/uploads/2018/05/word-image-4272-768x462.png 768w, /wp-content/uploads/2018/05/word-image-4272-1024x616.png 1024w" sizes="(max-width: 1064px) 100vw, 1064px" /></p>
<p>
  ⑤增加添加数据的前置钩子函数
</p>
<p><img loading="lazy" decoding="async" width="1103" height="700" src="/wp-content/uploads/2018/05/word-image-4273.png" class="wp-image-4749" srcset="/wp-content/uploads/2018/05/word-image-4273.png 1103w, /wp-content/uploads/2018/05/word-image-4273-300x190.png 300w, /wp-content/uploads/2018/05/word-image-4273-768x487.png 768w, /wp-content/uploads/2018/05/word-image-4273-1024x650.png 1024w" sizes="(max-width: 1103px) 100vw, 1103px" /></p>
<p>
  ⑥修改钩子函数增加价格判断
</p>
<p><img loading="lazy" decoding="async" width="986" height="653" src="/wp-content/uploads/2018/05/word-image-4274.png" class="wp-image-4750" srcset="/wp-content/uploads/2018/05/word-image-4274.png 986w, /wp-content/uploads/2018/05/word-image-4274-300x199.png 300w, /wp-content/uploads/2018/05/word-image-4274-768x509.png 768w" sizes="(max-width: 986px) 100vw, 986px" /></p>
<h2>5.3、使用ueditor实现商品详情</h2>
<h3>5.3.1、项目中使用ueditor</h3>
<p>
  ①拷贝源码
</p>
<p><img loading="lazy" decoding="async" width="1334" height="435" src="/wp-content/uploads/2018/05/word-image-4275.png" class="wp-image-4751" srcset="/wp-content/uploads/2018/05/word-image-4275.png 1334w, /wp-content/uploads/2018/05/word-image-4275-300x98.png 300w, /wp-content/uploads/2018/05/word-image-4275-768x250.png 768w, /wp-content/uploads/2018/05/word-image-4275-1024x334.png 1024w" sizes="(max-width: 1334px) 100vw, 1334px" /></p>
<p>
  ②在添加模板中引入编辑器的js文件
</p>
<p><img loading="lazy" decoding="async" width="1196" height="707" src="/wp-content/uploads/2018/05/word-image-4276.png" class="wp-image-4752" srcset="/wp-content/uploads/2018/05/word-image-4276.png 1196w, /wp-content/uploads/2018/05/word-image-4276-300x177.png 300w, /wp-content/uploads/2018/05/word-image-4276-768x454.png 768w, /wp-content/uploads/2018/05/word-image-4276-1024x605.png 1024w" sizes="(max-width: 1196px) 100vw, 1196px" /></p>
<h3>5.3.2、实现选项卡效果</h3>
<p>
  ①修改选项卡标签
</p>
<p><img loading="lazy" decoding="async" width="1018" height="340" src="/wp-content/uploads/2018/05/word-image-4277.png" class="wp-image-4753" srcset="/wp-content/uploads/2018/05/word-image-4277.png 1018w, /wp-content/uploads/2018/05/word-image-4277-300x100.png 300w, /wp-content/uploads/2018/05/word-image-4277-768x257.png 768w" sizes="(max-width: 1018px) 100vw, 1018px" /></p>
<p>
  ②修改商品详情使用选项卡
</p>
<p><img loading="lazy" decoding="async" width="1099" height="662" src="/wp-content/uploads/2018/05/word-image-4278.png" class="wp-image-4754" srcset="/wp-content/uploads/2018/05/word-image-4278.png 1099w, /wp-content/uploads/2018/05/word-image-4278-300x181.png 300w, /wp-content/uploads/2018/05/word-image-4278-768x463.png 768w, /wp-content/uploads/2018/05/word-image-4278-1024x617.png 1024w" sizes="(max-width: 1099px) 100vw, 1099px" /></p>
<p>
  ③修改父模板引入jQuery
</p>
<p><img loading="lazy" decoding="async" width="1148" height="684" src="/wp-content/uploads/2018/05/word-image-4279.png" class="wp-image-4755" srcset="/wp-content/uploads/2018/05/word-image-4279.png 1148w, /wp-content/uploads/2018/05/word-image-4279-300x179.png 300w, /wp-content/uploads/2018/05/word-image-4279-768x458.png 768w, /wp-content/uploads/2018/05/word-image-4279-1024x610.png 1024w" sizes="(max-width: 1148px) 100vw, 1148px" /></p>
<p>
  ④实现切换效果
</p>
<p><img loading="lazy" decoding="async" width="1027" height="598" src="/wp-content/uploads/2018/05/word-image-4280.png" class="wp-image-4756" srcset="/wp-content/uploads/2018/05/word-image-4280.png 1027w, /wp-content/uploads/2018/05/word-image-4280-300x175.png 300w, /wp-content/uploads/2018/05/word-image-4280-768x447.png 768w, /wp-content/uploads/2018/05/word-image-4280-1024x596.png 1024w" sizes="(max-width: 1027px) 100vw, 1027px" /></p>
<h3>5.3.3、查看ueditor文件上传的流程(了解)</h3>
<p>
  ①抓包查找文件上传地址
</p>
<p><img loading="lazy" decoding="async" width="1177" height="531" src="/wp-content/uploads/2018/05/word-image-4281.png" class="wp-image-4757" srcset="/wp-content/uploads/2018/05/word-image-4281.png 1177w, /wp-content/uploads/2018/05/word-image-4281-300x135.png 300w, /wp-content/uploads/2018/05/word-image-4281-768x346.png 768w, /wp-content/uploads/2018/05/word-image-4281-1024x462.png 1024w" sizes="(max-width: 1177px) 100vw, 1177px" /></p>
<p>
  ②查看controller.php
</p>
<p><img loading="lazy" decoding="async" width="1008" height="698" src="/wp-content/uploads/2018/05/word-image-4282.png" class="wp-image-4758" srcset="/wp-content/uploads/2018/05/word-image-4282.png 1008w, /wp-content/uploads/2018/05/word-image-4282-300x208.png 300w, /wp-content/uploads/2018/05/word-image-4282-768x532.png 768w" sizes="(max-width: 1008px) 100vw, 1008px" /></p>
<p>
  ③查看action_upload.php
</p>
<p><img loading="lazy" decoding="async" width="970" height="627" src="/wp-content/uploads/2018/05/word-image-4283.png" class="wp-image-4759" srcset="/wp-content/uploads/2018/05/word-image-4283.png 970w, /wp-content/uploads/2018/05/word-image-4283-300x194.png 300w, /wp-content/uploads/2018/05/word-image-4283-768x496.png 768w" sizes="(max-width: 970px) 100vw, 970px" /></p>
<p>
  ④查看upload类
</p>
<p><img loading="lazy" decoding="async" width="1016" height="607" src="/wp-content/uploads/2018/05/word-image-4284.png" class="wp-image-4760" srcset="/wp-content/uploads/2018/05/word-image-4284.png 1016w, /wp-content/uploads/2018/05/word-image-4284-300x179.png 300w, /wp-content/uploads/2018/05/word-image-4284-768x459.png 768w" sizes="(max-width: 1016px) 100vw, 1016px" /></p>
<p>
  对于上图的upFile及实现了文件上传的功能，关于需要修改上传逻辑的可以在下图中代码实现
</p>
<p><img loading="lazy" decoding="async" width="989" height="500" src="/wp-content/uploads/2018/05/word-image-4285.png" class="wp-image-4761" srcset="/wp-content/uploads/2018/05/word-image-4285.png 989w, /wp-content/uploads/2018/05/word-image-4285-300x152.png 300w, /wp-content/uploads/2018/05/word-image-4285-768x388.png 768w" sizes="(max-width: 989px) 100vw, 989px" /></p>
<h2>5.3、实现图片上传</h2>
<h3>5.3.1、TP中的文件上传功能</h3>
<p>
  ①查看文件上传的配置信息
</p>
<p><img loading="lazy" decoding="async" width="987" height="702" src="/wp-content/uploads/2018/05/word-image-4286.png" class="wp-image-4762" srcset="/wp-content/uploads/2018/05/word-image-4286.png 987w, /wp-content/uploads/2018/05/word-image-4286-300x213.png 300w, /wp-content/uploads/2018/05/word-image-4286-768x546.png 768w" sizes="(max-width: 987px) 100vw, 987px" /></p>
<p>
  ②查看文件上传的方法
</p>
<p><img loading="lazy" decoding="async" width="966" height="650" src="/wp-content/uploads/2018/05/word-image-4287.png" class="wp-image-4763" srcset="/wp-content/uploads/2018/05/word-image-4287.png 966w, /wp-content/uploads/2018/05/word-image-4287-300x202.png 300w, /wp-content/uploads/2018/05/word-image-4287-768x517.png 768w" sizes="(max-width: 966px) 100vw, 966px" /></p>
<h3>5.3.2、具体实现文件上传</h3>
<p>
  ①创建测试方法显示上传表单
</p>
<p><img loading="lazy" decoding="async" width="805" height="411" src="/wp-content/uploads/2018/05/word-image-4288.png" class="wp-image-4764" srcset="/wp-content/uploads/2018/05/word-image-4288.png 805w, /wp-content/uploads/2018/05/word-image-4288-300x153.png 300w, /wp-content/uploads/2018/05/word-image-4288-768x392.png 768w" sizes="(max-width: 805px) 100vw, 805px" /></p>
<p>
  ②处理上传的表单
</p>
<p><img loading="lazy" decoding="async" width="1055" height="653" src="/wp-content/uploads/2018/05/word-image-4289.png" class="wp-image-4765" srcset="/wp-content/uploads/2018/05/word-image-4289.png 1055w, /wp-content/uploads/2018/05/word-image-4289-300x186.png 300w, /wp-content/uploads/2018/05/word-image-4289-768x475.png 768w, /wp-content/uploads/2018/05/word-image-4289-1024x634.png 1024w" sizes="(max-width: 1055px) 100vw, 1055px" /></p>
<p>
  ③实现文件上传
</p>
<p><img loading="lazy" decoding="async" width="986" height="686" src="/wp-content/uploads/2018/05/word-image-4290.png" class="wp-image-4766" srcset="/wp-content/uploads/2018/05/word-image-4290.png 986w, /wp-content/uploads/2018/05/word-image-4290-300x209.png 300w, /wp-content/uploads/2018/05/word-image-4290-768x534.png 768w" sizes="(max-width: 986px) 100vw, 986px" /></p>
<p>
  ④查看效果
</p>
<p><img loading="lazy" decoding="async" width="491" height="204" src="/wp-content/uploads/2018/05/word-image-4291.png" class="wp-image-4767" srcset="/wp-content/uploads/2018/05/word-image-4291.png 491w, /wp-content/uploads/2018/05/word-image-4291-300x125.png 300w" sizes="(max-width: 491px) 100vw, 491px" /></p>
<p>
  ⑤手动创建上传的根目录
</p>
<p><img loading="lazy" decoding="async" width="732" height="292" src="/wp-content/uploads/2018/05/word-image-4292.png" class="wp-image-4768" srcset="/wp-content/uploads/2018/05/word-image-4292.png 732w, /wp-content/uploads/2018/05/word-image-4292-300x120.png 300w" sizes="(max-width: 732px) 100vw, 732px" /></p>
<p>
  ⑤再次查看效果
</p>
<p><img loading="lazy" decoding="async" width="578" height="328" src="/wp-content/uploads/2018/05/word-image-4293.png" class="wp-image-4769" srcset="/wp-content/uploads/2018/05/word-image-4293.png 578w, /wp-content/uploads/2018/05/word-image-4293-300x170.png 300w" sizes="(max-width: 578px) 100vw, 578px" /></p>
<h3>5.3.3、在项目中使用文件上传</h3>
<p>
  ①修改添加的前置钩子函数实现文件上传
</p>
<p><img loading="lazy" decoding="async" width="1025" height="671" src="/wp-content/uploads/2018/05/word-image-4294.png" class="wp-image-4770" srcset="/wp-content/uploads/2018/05/word-image-4294.png 1025w, /wp-content/uploads/2018/05/word-image-4294-300x196.png 300w, /wp-content/uploads/2018/05/word-image-4294-768x503.png 768w, /wp-content/uploads/2018/05/word-image-4294-1024x670.png 1024w" sizes="(max-width: 1025px) 100vw, 1025px" /><br />
<img loading="lazy" decoding="async" width="996" height="587" src="/wp-content/uploads/2018/05/word-image-4295.png" class="wp-image-4771" srcset="/wp-content/uploads/2018/05/word-image-4295.png 996w, /wp-content/uploads/2018/05/word-image-4295-300x177.png 300w, /wp-content/uploads/2018/05/word-image-4295-768x453.png 768w" sizes="(max-width: 996px) 100vw, 996px" /></p>
<p>
  ②查看结果
</p>
<p><img loading="lazy" decoding="async" width="1090" height="446" src="/wp-content/uploads/2018/05/word-image-4296.png" class="wp-image-4772" srcset="/wp-content/uploads/2018/05/word-image-4296.png 1090w, /wp-content/uploads/2018/05/word-image-4296-300x123.png 300w, /wp-content/uploads/2018/05/word-image-4296-768x314.png 768w, /wp-content/uploads/2018/05/word-image-4296-1024x419.png 1024w" sizes="(max-width: 1090px) 100vw, 1090px" /></p>
<p>
  ③修改前置钩子函数的文件上传
</p>
<p><img loading="lazy" decoding="async" width="1041" height="631" src="/wp-content/uploads/2018/05/word-image-4297.png" class="wp-image-4773" srcset="/wp-content/uploads/2018/05/word-image-4297.png 1041w, /wp-content/uploads/2018/05/word-image-4297-300x182.png 300w, /wp-content/uploads/2018/05/word-image-4297-768x466.png 768w, /wp-content/uploads/2018/05/word-image-4297-1024x621.png 1024w" sizes="(max-width: 1041px) 100vw, 1041px" /></p>
<h2>5.4、处理商品的缩略图</h2>
<h3>5.4.1、生成缩略图流程</h3>
<ol>
<li>
  实例化Image对象
</li>
<li>
  使用对象打开图片
</li>
<li>
  指定方法对图片进行处理，并且将图片进行保存
</li>
</ol>
<h3>5.4.2、生成商品的缩略图</h3>
<p>
  ①修改添加的前置钩子函数
</p>
<p><img loading="lazy" decoding="async" width="1039" height="688" src="/wp-content/uploads/2018/05/word-image-4298.png" class="wp-image-4774" srcset="/wp-content/uploads/2018/05/word-image-4298.png 1039w, /wp-content/uploads/2018/05/word-image-4298-300x199.png 300w, /wp-content/uploads/2018/05/word-image-4298-768x509.png 768w, /wp-content/uploads/2018/05/word-image-4298-1024x678.png 1024w" sizes="(max-width: 1039px) 100vw, 1039px" /></p>
<p>
  针对文件上传成功之后在处理图片
</p>
<p>
  ②查看效果
</p>
<p><img loading="lazy" decoding="async" width="628" height="253" src="/wp-content/uploads/2018/05/word-image-4299.png" class="wp-image-4775" srcset="/wp-content/uploads/2018/05/word-image-4299.png 628w, /wp-content/uploads/2018/05/word-image-4299-300x121.png 300w" sizes="(max-width: 628px) 100vw, 628px" /></p>
]]></content:encoded>
					
					<wfw:commentRss>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4706.html/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>TP3.2商城 （二）图片异步上传、商品列表、缓存、商品编辑、商品类型</title>
		<link>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4627.html</link>
					<comments>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4627.html#respond</comments>
		
		<dc:creator><![CDATA[Mr.Lee]]></dc:creator>
		<pubDate>Sat, 19 May 2018 12:59:04 +0000</pubDate>
				<category><![CDATA[TP3.2]]></category>
		<category><![CDATA[TP3.2商城]]></category>
		<category><![CDATA[后台框架]]></category>
		<category><![CDATA[商品列表]]></category>
		<category><![CDATA[商品类型]]></category>
		<category><![CDATA[商品编辑]]></category>
		<category><![CDATA[图片异步上传]]></category>
		<category><![CDATA[缓存]]></category>
		<guid isPermaLink="false">/?p=4627</guid>

					<description><![CDATA[添加商品图片异步上传 1.1、查看layUI使用方式 ①引入对应的js文件 ②查看文件上传使用方式 1.2、项 [&#8230;]]]></description>
										<content:encoded><![CDATA[<h1>添加商品图片异步上传</h1>
<h2>1.1、查看layUI使用方式</h2>
<p>
  ①引入对应的js文件
</p>
<p><img loading="lazy" decoding="async" width="840" height="455" src="/wp-content/uploads/2018/05/word-image-4154.png" class="wp-image-4628" srcset="/wp-content/uploads/2018/05/word-image-4154.png 840w, /wp-content/uploads/2018/05/word-image-4154-300x163.png 300w, /wp-content/uploads/2018/05/word-image-4154-768x416.png 768w" sizes="(max-width: 840px) 100vw, 840px" /></p>
<p>
  ②查看文件上传使用方式
</p>
<p><img loading="lazy" decoding="async" width="785" height="627" src="/wp-content/uploads/2018/05/word-image-4155.png" class="wp-image-4629" srcset="/wp-content/uploads/2018/05/word-image-4155.png 785w, /wp-content/uploads/2018/05/word-image-4155-300x240.png 300w, /wp-content/uploads/2018/05/word-image-4155-768x613.png 768w" sizes="(max-width: 785px) 100vw, 785px" /></p>
<h2>1.2、项目中使用文件上传</h2>
<p>
  ①将资源文件拷贝到项目中
</p>
<p><img loading="lazy" decoding="async" width="1068" height="324" src="/wp-content/uploads/2018/05/word-image-4156.png" class="wp-image-4630" srcset="/wp-content/uploads/2018/05/word-image-4156.png 1068w, /wp-content/uploads/2018/05/word-image-4156-300x91.png 300w, /wp-content/uploads/2018/05/word-image-4156-768x233.png 768w, /wp-content/uploads/2018/05/word-image-4156-1024x311.png 1024w" sizes="(max-width: 1068px) 100vw, 1068px" /></p>
<p>
  ②引入layui的js文件
</p>
<p><img loading="lazy" decoding="async" width="986" height="263" src="/wp-content/uploads/2018/05/word-image-4157.png" class="wp-image-4631" srcset="/wp-content/uploads/2018/05/word-image-4157.png 986w, /wp-content/uploads/2018/05/word-image-4157-300x80.png 300w, /wp-content/uploads/2018/05/word-image-4157-768x205.png 768w" sizes="(max-width: 986px) 100vw, 986px" /></p>
<p>
  ③修改文件上传的type类型
</p>
<p><img loading="lazy" decoding="async" width="1003" height="385" src="/wp-content/uploads/2018/05/word-image-4158.png" class="wp-image-4632" srcset="/wp-content/uploads/2018/05/word-image-4158.png 1003w, /wp-content/uploads/2018/05/word-image-4158-300x115.png 300w, /wp-content/uploads/2018/05/word-image-4158-768x295.png 768w" sizes="(max-width: 1003px) 100vw, 1003px" /></p>
<p>
  ④对文件上传绑定切换事件
</p>
<p><img loading="lazy" decoding="async" width="962" height="640" src="/wp-content/uploads/2018/05/word-image-4159.png" class="wp-image-4633" srcset="/wp-content/uploads/2018/05/word-image-4159.png 962w, /wp-content/uploads/2018/05/word-image-4159-300x200.png 300w, /wp-content/uploads/2018/05/word-image-4159-768x511.png 768w" sizes="(max-width: 962px) 100vw, 962px" /></p>
<p>
  ⑤创建upload方法
</p>
<p>
  先抓包结果如下
</p>
<p><img loading="lazy" decoding="async" width="1031" height="534" src="/wp-content/uploads/2018/05/word-image-4160.png" class="wp-image-4634" srcset="/wp-content/uploads/2018/05/word-image-4160.png 1031w, /wp-content/uploads/2018/05/word-image-4160-300x155.png 300w, /wp-content/uploads/2018/05/word-image-4160-768x398.png 768w, /wp-content/uploads/2018/05/word-image-4160-1024x530.png 1024w" sizes="(max-width: 1031px) 100vw, 1031px" /><br />
<img loading="lazy" decoding="async" width="1039" height="672" src="/wp-content/uploads/2018/05/word-image-4161.png" class="wp-image-4635" srcset="/wp-content/uploads/2018/05/word-image-4161.png 1039w, /wp-content/uploads/2018/05/word-image-4161-300x194.png 300w, /wp-content/uploads/2018/05/word-image-4161-768x497.png 768w, /wp-content/uploads/2018/05/word-image-4161-1024x662.png 1024w" sizes="(max-width: 1039px) 100vw, 1039px" /><br />
<img loading="lazy" decoding="async" width="1030" height="303" src="/wp-content/uploads/2018/05/word-image-4162.png" class="wp-image-4636" srcset="/wp-content/uploads/2018/05/word-image-4162.png 1030w, /wp-content/uploads/2018/05/word-image-4162-300x88.png 300w, /wp-content/uploads/2018/05/word-image-4162-768x226.png 768w, /wp-content/uploads/2018/05/word-image-4162-1024x301.png 1024w" sizes="(max-width: 1030px) 100vw, 1030px" /></p>
<p>
  ⑥修改模板增加img显示上传结果
</p>
<p><img loading="lazy" decoding="async" width="1010" height="493" src="/wp-content/uploads/2018/05/word-image-4163.png" class="wp-image-4637" srcset="/wp-content/uploads/2018/05/word-image-4163.png 1010w, /wp-content/uploads/2018/05/word-image-4163-300x146.png 300w, /wp-content/uploads/2018/05/word-image-4163-768x375.png 768w" sizes="(max-width: 1010px) 100vw, 1010px" /></p>
<p>
  ⑦修改js处理文件上传成功
</p>
<p><img loading="lazy" decoding="async" width="1022" height="598" src="/wp-content/uploads/2018/05/word-image-4164.png" class="wp-image-4638" srcset="/wp-content/uploads/2018/05/word-image-4164.png 1022w, /wp-content/uploads/2018/05/word-image-4164-300x176.png 300w, /wp-content/uploads/2018/05/word-image-4164-768x449.png 768w" sizes="(max-width: 1022px) 100vw, 1022px" /></p>
<p>
  ⑧修改商品添加的HTML
</p>
<p><img loading="lazy" decoding="async" width="1045" height="451" src="/wp-content/uploads/2018/05/word-image-4165.png" class="wp-image-4639" srcset="/wp-content/uploads/2018/05/word-image-4165.png 1045w, /wp-content/uploads/2018/05/word-image-4165-300x129.png 300w, /wp-content/uploads/2018/05/word-image-4165-768x331.png 768w, /wp-content/uploads/2018/05/word-image-4165-1024x442.png 1024w" sizes="(max-width: 1045px) 100vw, 1045px" /></p>
<p>
  ⑨修改js
</p>
<p><img loading="lazy" decoding="async" width="1037" height="650" src="/wp-content/uploads/2018/05/word-image-4166.png" class="wp-image-4640" srcset="/wp-content/uploads/2018/05/word-image-4166.png 1037w, /wp-content/uploads/2018/05/word-image-4166-300x188.png 300w, /wp-content/uploads/2018/05/word-image-4166-768x481.png 768w, /wp-content/uploads/2018/05/word-image-4166-1024x642.png 1024w" sizes="(max-width: 1037px) 100vw, 1037px" /></p>
<p>
  ⑩修改添加的前置钩子函数删除文件上传代码
</p>
<p><img loading="lazy" decoding="async" width="1000" height="662" src="/wp-content/uploads/2018/05/word-image-4167.png" class="wp-image-4641" srcset="/wp-content/uploads/2018/05/word-image-4167.png 1000w, /wp-content/uploads/2018/05/word-image-4167-300x199.png 300w, /wp-content/uploads/2018/05/word-image-4167-768x508.png 768w" sizes="(max-width: 1000px) 100vw, 1000px" /></p>
<p>
  由于目前文件上传使用了异步的方式因此此处的代码多余
</p>
<h2>1.3、使用ajaxReturn返回结果</h2>
<p>
  ①查看ajaxReturn方法的使用方式
</p>
<p><img loading="lazy" decoding="async" width="1001" height="632" src="/wp-content/uploads/2018/05/word-image-4168.png" class="wp-image-4642" srcset="/wp-content/uploads/2018/05/word-image-4168.png 1001w, /wp-content/uploads/2018/05/word-image-4168-300x189.png 300w, /wp-content/uploads/2018/05/word-image-4168-768x485.png 768w" sizes="(max-width: 1001px) 100vw, 1001px" /></p>
<p>
  ②修改upload方法使用ajaxReturn
</p>
<p><img loading="lazy" decoding="async" width="1038" height="673" src="/wp-content/uploads/2018/05/word-image-4169.png" class="wp-image-4643" srcset="/wp-content/uploads/2018/05/word-image-4169.png 1038w, /wp-content/uploads/2018/05/word-image-4169-300x195.png 300w, /wp-content/uploads/2018/05/word-image-4169-768x498.png 768w, /wp-content/uploads/2018/05/word-image-4169-1024x664.png 1024w" sizes="(max-width: 1038px) 100vw, 1038px" /></p>
<h1>商品列表</h1>
<h2>2.1、实现显示商品的列表</h2>
<p>
  ①在控制器中增加方法
</p>
<p><img loading="lazy" decoding="async" width="948" height="523" src="/wp-content/uploads/2018/05/word-image-4170.png" class="wp-image-4644" srcset="/wp-content/uploads/2018/05/word-image-4170.png 948w, /wp-content/uploads/2018/05/word-image-4170-300x166.png 300w, /wp-content/uploads/2018/05/word-image-4170-768x424.png 768w" sizes="(max-width: 948px) 100vw, 948px" /></p>
<p>
  ②在模型中增加listData方法获取数据
</p>
<p>
  <br />
  ③拷贝模板
</p>
<p><img loading="lazy" decoding="async" width="710" height="428" src="/wp-content/uploads/2018/05/word-image-4171.png" class="wp-image-4645" srcset="/wp-content/uploads/2018/05/word-image-4171.png 710w, /wp-content/uploads/2018/05/word-image-4171-300x181.png 300w" sizes="(max-width: 710px) 100vw, 710px" /><br />
<img loading="lazy" decoding="async" width="1100" height="457" src="/wp-content/uploads/2018/05/word-image-4172.png" class="wp-image-4646" srcset="/wp-content/uploads/2018/05/word-image-4172.png 1100w, /wp-content/uploads/2018/05/word-image-4172-300x125.png 300w, /wp-content/uploads/2018/05/word-image-4172-768x319.png 768w, /wp-content/uploads/2018/05/word-image-4172-1024x425.png 1024w" sizes="(max-width: 1100px) 100vw, 1100px" /></p>
<p>
  ④修改模板
</p>
<p><img loading="lazy" decoding="async" width="1026" height="688" src="/wp-content/uploads/2018/05/word-image-4173.png" class="wp-image-4647" srcset="/wp-content/uploads/2018/05/word-image-4173.png 1026w, /wp-content/uploads/2018/05/word-image-4173-300x201.png 300w, /wp-content/uploads/2018/05/word-image-4173-768x515.png 768w, /wp-content/uploads/2018/05/word-image-4173-1024x687.png 1024w" sizes="(max-width: 1026px) 100vw, 1026px" /><br />
<img loading="lazy" decoding="async" width="1000" height="586" src="/wp-content/uploads/2018/05/word-image-4174.png" class="wp-image-4648" srcset="/wp-content/uploads/2018/05/word-image-4174.png 1000w, /wp-content/uploads/2018/05/word-image-4174-300x176.png 300w, /wp-content/uploads/2018/05/word-image-4174-768x450.png 768w" sizes="(max-width: 1000px) 100vw, 1000px" /><br />
<img loading="lazy" decoding="async" width="1029" height="558" src="/wp-content/uploads/2018/05/word-image-4175.png" class="wp-image-4649" srcset="/wp-content/uploads/2018/05/word-image-4175.png 1029w, /wp-content/uploads/2018/05/word-image-4175-300x163.png 300w, /wp-content/uploads/2018/05/word-image-4175-768x416.png 768w, /wp-content/uploads/2018/05/word-image-4175-1024x555.png 1024w" sizes="(max-width: 1029px) 100vw, 1029px" /><br />
<img loading="lazy" decoding="async" width="1013" height="589" src="/wp-content/uploads/2018/05/word-image-4176.png" class="wp-image-4650" srcset="/wp-content/uploads/2018/05/word-image-4176.png 1013w, /wp-content/uploads/2018/05/word-image-4176-300x174.png 300w, /wp-content/uploads/2018/05/word-image-4176-768x447.png 768w" sizes="(max-width: 1013px) 100vw, 1013px" /><br />
<img loading="lazy" decoding="async" width="982" height="166" src="/wp-content/uploads/2018/05/word-image-4177.png" class="wp-image-4651" srcset="/wp-content/uploads/2018/05/word-image-4177.png 982w, /wp-content/uploads/2018/05/word-image-4177-300x51.png 300w, /wp-content/uploads/2018/05/word-image-4177-768x130.png 768w" sizes="(max-width: 982px) 100vw, 982px" /></p>
<h2>2.2、实现分页显示商品列表</h2>
<p>
  ①修改listData方法
</p>
<p><img loading="lazy" decoding="async" width="962" height="677" src="/wp-content/uploads/2018/05/word-image-4178.png" class="wp-image-4652" srcset="/wp-content/uploads/2018/05/word-image-4178.png 962w, /wp-content/uploads/2018/05/word-image-4178-300x211.png 300w, /wp-content/uploads/2018/05/word-image-4178-768x540.png 768w" sizes="(max-width: 962px) 100vw, 962px" /></p>
<p>
  ②修改模板
</p>
<p>
  修改循环的变量
</p>
<p><img loading="lazy" decoding="async" width="1012" height="492" src="/wp-content/uploads/2018/05/word-image-4179.png" class="wp-image-4653" srcset="/wp-content/uploads/2018/05/word-image-4179.png 1012w, /wp-content/uploads/2018/05/word-image-4179-300x146.png 300w, /wp-content/uploads/2018/05/word-image-4179-768x373.png 768w" sizes="(max-width: 1012px) 100vw, 1012px" /></p>
<p>
  修改使用分页
</p>
<p><img loading="lazy" decoding="async" width="925" height="483" src="/wp-content/uploads/2018/05/word-image-4180.png" class="wp-image-4654" srcset="/wp-content/uploads/2018/05/word-image-4180.png 925w, /wp-content/uploads/2018/05/word-image-4180-300x157.png 300w, /wp-content/uploads/2018/05/word-image-4180-768x401.png 768w" sizes="(max-width: 925px) 100vw, 925px" /></p>
<h2>2.3、获取分类名称</h2>
<p>
  修改listData方法链表查询分类名称
</p>
<p><img loading="lazy" decoding="async" width="1002" height="487" src="/wp-content/uploads/2018/05/word-image-4181.png" class="wp-image-4655" srcset="/wp-content/uploads/2018/05/word-image-4181.png 1002w, /wp-content/uploads/2018/05/word-image-4181-300x146.png 300w, /wp-content/uploads/2018/05/word-image-4181-768x373.png 768w" sizes="(max-width: 1002px) 100vw, 1002px" /></p>
<h2>2.4、商品搜索</h2>
<h3>2.4.1、显示搜索的分类</h3>
<p>
  ①index方法获取所有的分类信息
</p>
<p><img loading="lazy" decoding="async" width="894" height="565" src="/wp-content/uploads/2018/05/word-image-4182.png" class="wp-image-4656" srcset="/wp-content/uploads/2018/05/word-image-4182.png 894w, /wp-content/uploads/2018/05/word-image-4182-300x190.png 300w, /wp-content/uploads/2018/05/word-image-4182-768x485.png 768w" sizes="(max-width: 894px) 100vw, 894px" /></p>
<p>
  ②修改模板显示分类
</p>
<p><img loading="lazy" decoding="async" width="1030" height="562" src="/wp-content/uploads/2018/05/word-image-4183.png" class="wp-image-4657" srcset="/wp-content/uploads/2018/05/word-image-4183.png 1030w, /wp-content/uploads/2018/05/word-image-4183-300x164.png 300w, /wp-content/uploads/2018/05/word-image-4183-768x419.png 768w, /wp-content/uploads/2018/05/word-image-4183-1024x559.png 1024w" sizes="(max-width: 1030px) 100vw, 1030px" /></p>
<h3>2.4.2、根据搜索的提交获取数据</h3>
<p>
  根据条件对商品进行搜索本质就是表单提交。对于表单提交想要去获取到对应的条件的商品信息就需要去组装sql语句中的where条件
</p>
<p>
  修改listData方法
</p>
<p><img loading="lazy" decoding="async" width="1005" height="669" src="/wp-content/uploads/2018/05/word-image-4184.png" class="wp-image-4658" srcset="/wp-content/uploads/2018/05/word-image-4184.png 1005w, /wp-content/uploads/2018/05/word-image-4184-300x200.png 300w, /wp-content/uploads/2018/05/word-image-4184-768x511.png 768w" sizes="(max-width: 1005px) 100vw, 1005px" /><br />
<img loading="lazy" decoding="async" width="1038" height="606" src="/wp-content/uploads/2018/05/word-image-4185.png" class="wp-image-4659" srcset="/wp-content/uploads/2018/05/word-image-4185.png 1038w, /wp-content/uploads/2018/05/word-image-4185-300x175.png 300w, /wp-content/uploads/2018/05/word-image-4185-768x448.png 768w, /wp-content/uploads/2018/05/word-image-4185-1024x598.png 1024w" sizes="(max-width: 1038px) 100vw, 1038px" /><br />
<img loading="lazy" decoding="async" width="1013" height="478" src="/wp-content/uploads/2018/05/word-image-4186.png" class="wp-image-4660" srcset="/wp-content/uploads/2018/05/word-image-4186.png 1013w, /wp-content/uploads/2018/05/word-image-4186-300x142.png 300w, /wp-content/uploads/2018/05/word-image-4186-768x362.png 768w" sizes="(max-width: 1013px) 100vw, 1013px" /></p>
<h2>2.5、对商品列表进行优化</h2>
<h3>2.5.1、实现方式</h3>
<p>
  使用替换的方式将链表查询拆分成为两次sql查询（第一次查询后期可以使用高速内存缓存系统加速）
</p>
<ol>
<li>
  先获取所有分类的信息
</li>
<li>
  根据页码获取到当前页的商品信息(单表查询)
</li>
<li>
  对商品信息进行循环根据分类的id使用第一次查询结果进行替换
</li>
</ol>
<h3>2.5.2、具体代码操作</h3>
<p>
  ①修改index方法传递分类信息作为参数
</p>
<p><img loading="lazy" decoding="async" width="906" height="599" src="/wp-content/uploads/2018/05/word-image-4187.png" class="wp-image-4661" srcset="/wp-content/uploads/2018/05/word-image-4187.png 906w, /wp-content/uploads/2018/05/word-image-4187-300x198.png 300w, /wp-content/uploads/2018/05/word-image-4187-768x508.png 768w" sizes="(max-width: 906px) 100vw, 906px" /></p>
<p>
  ②修改模型下的listData方法
</p>
<p><img loading="lazy" decoding="async" width="994" height="674" src="/wp-content/uploads/2018/05/word-image-4188.png" class="wp-image-4662" srcset="/wp-content/uploads/2018/05/word-image-4188.png 994w, /wp-content/uploads/2018/05/word-image-4188-300x203.png 300w, /wp-content/uploads/2018/05/word-image-4188-768x521.png 768w, /wp-content/uploads/2018/05/word-image-4188-220x150.png 220w" sizes="(max-width: 994px) 100vw, 994px" /><br />
<img loading="lazy" decoding="async" width="1018" height="578" src="/wp-content/uploads/2018/05/word-image-4189.png" class="wp-image-4663" srcset="/wp-content/uploads/2018/05/word-image-4189.png 1018w, /wp-content/uploads/2018/05/word-image-4189-300x170.png 300w, /wp-content/uploads/2018/05/word-image-4189-768x436.png 768w" sizes="(max-width: 1018px) 100vw, 1018px" /></p>
<h2>2.6、缓存使用(重点)</h2>
<h3>2.6.1、缓存使用的原理</h3>
<ol>
<li>
  当读取数据时。优先查询缓存系统(文件、内存)中的内容，如果读取到了数据直接使用。如果没有读取到在查询数据库获取数据，然后在将数据写入到缓存系统中
</li>
<li>
  当修改数据时，需要对缓存系统中的内容进行更新或者删除操作
</li>
</ol>
<h3>2.6.2、TP中的S函数使用</h3>
<p><img loading="lazy" decoding="async" width="1030" height="634" src="/wp-content/uploads/2018/05/word-image-4190.png" class="wp-image-4664" srcset="/wp-content/uploads/2018/05/word-image-4190.png 1030w, /wp-content/uploads/2018/05/word-image-4190-300x185.png 300w, /wp-content/uploads/2018/05/word-image-4190-768x473.png 768w, /wp-content/uploads/2018/05/word-image-4190-1024x630.png 1024w" sizes="(max-width: 1030px) 100vw, 1030px" /></p>
<h3>2.6.3、在项目中使用S函数</h3>
<p>
  ①修改listData方法使用缓存
</p>
<p><img loading="lazy" decoding="async" width="1222" height="611" src="/wp-content/uploads/2018/05/word-image-4191.png" class="wp-image-4665" srcset="/wp-content/uploads/2018/05/word-image-4191.png 1222w, /wp-content/uploads/2018/05/word-image-4191-300x150.png 300w, /wp-content/uploads/2018/05/word-image-4191-768x384.png 768w, /wp-content/uploads/2018/05/word-image-4191-1024x512.png 1024w" sizes="(max-width: 1222px) 100vw, 1222px" /></p>
<p>
  ②查看效果
</p>
<p><img loading="lazy" decoding="async" width="1285" height="482" src="/wp-content/uploads/2018/05/word-image-4192.png" class="wp-image-4666" srcset="/wp-content/uploads/2018/05/word-image-4192.png 1285w, /wp-content/uploads/2018/05/word-image-4192-300x113.png 300w, /wp-content/uploads/2018/05/word-image-4192-768x288.png 768w, /wp-content/uploads/2018/05/word-image-4192-1024x384.png 1024w" sizes="(max-width: 1285px) 100vw, 1285px" /></p>
<h3>2.6.4、针对所有的分类的使用缓存</h3>
<p>
  ①修改getTree方法
</p>
<p><img loading="lazy" decoding="async" width="1039" height="681" src="/wp-content/uploads/2018/05/word-image-4193.png" class="wp-image-4667" srcset="/wp-content/uploads/2018/05/word-image-4193.png 1039w, /wp-content/uploads/2018/05/word-image-4193-300x197.png 300w, /wp-content/uploads/2018/05/word-image-4193-768x503.png 768w, /wp-content/uploads/2018/05/word-image-4193-1024x671.png 1024w" sizes="(max-width: 1039px) 100vw, 1039px" /></p>
<p>
  ②修改listData方法
</p>
<p><img loading="lazy" decoding="async" width="1032" height="646" src="/wp-content/uploads/2018/05/word-image-4194.png" class="wp-image-4668" srcset="/wp-content/uploads/2018/05/word-image-4194.png 1032w, /wp-content/uploads/2018/05/word-image-4194-300x188.png 300w, /wp-content/uploads/2018/05/word-image-4194-768x481.png 768w, /wp-content/uploads/2018/05/word-image-4194-1024x641.png 1024w" sizes="(max-width: 1032px) 100vw, 1032px" /></p>
<p>
  ③针对分类的添加对缓存进行更新
</p>
<p><img loading="lazy" decoding="async" width="1020" height="714" src="/wp-content/uploads/2018/05/word-image-4195.png" class="wp-image-4669" srcset="/wp-content/uploads/2018/05/word-image-4195.png 1020w, /wp-content/uploads/2018/05/word-image-4195-300x210.png 300w, /wp-content/uploads/2018/05/word-image-4195-768x538.png 768w" sizes="(max-width: 1020px) 100vw, 1020px" /></p>
<p>
  ④分类到的修改更新缓存
</p>
<p><img loading="lazy" decoding="async" width="952" height="658" src="/wp-content/uploads/2018/05/word-image-4196.png" class="wp-image-4670" srcset="/wp-content/uploads/2018/05/word-image-4196.png 952w, /wp-content/uploads/2018/05/word-image-4196-300x207.png 300w, /wp-content/uploads/2018/05/word-image-4196-768x531.png 768w" sizes="(max-width: 952px) 100vw, 952px" /></p>
<p>
  ⑤删除分类更新缓存
</p>
<p><img loading="lazy" decoding="async" width="931" height="688" src="/wp-content/uploads/2018/05/word-image-4197.png" class="wp-image-4671" srcset="/wp-content/uploads/2018/05/word-image-4197.png 931w, /wp-content/uploads/2018/05/word-image-4197-300x222.png 300w, /wp-content/uploads/2018/05/word-image-4197-768x568.png 768w" sizes="(max-width: 931px) 100vw, 931px" /></p>
<h2>2.7、实现状态的点击切换</h2>
<p>
  ①修改商品列表的模板
</p>
<p><img loading="lazy" decoding="async" width="1284" height="674" src="/wp-content/uploads/2018/05/word-image-4198.png" class="wp-image-4672" srcset="/wp-content/uploads/2018/05/word-image-4198.png 1284w, /wp-content/uploads/2018/05/word-image-4198-300x157.png 300w, /wp-content/uploads/2018/05/word-image-4198-768x403.png 768w, /wp-content/uploads/2018/05/word-image-4198-1024x538.png 1024w" sizes="(max-width: 1284px) 100vw, 1284px" /></p>
<p>
  ②增加函数实现ajax
</p>
<p><img loading="lazy" decoding="async" width="955" height="676" src="/wp-content/uploads/2018/05/word-image-4199.png" class="wp-image-4673" srcset="/wp-content/uploads/2018/05/word-image-4199.png 955w, /wp-content/uploads/2018/05/word-image-4199-300x212.png 300w, /wp-content/uploads/2018/05/word-image-4199-768x544.png 768w" sizes="(max-width: 955px) 100vw, 955px" /></p>
<p>
  ③创建方法处理请求
</p>
<p><img loading="lazy" decoding="async" width="1046" height="644" src="/wp-content/uploads/2018/05/word-image-4200.png" class="wp-image-4674" srcset="/wp-content/uploads/2018/05/word-image-4200.png 1046w, /wp-content/uploads/2018/05/word-image-4200-300x185.png 300w, /wp-content/uploads/2018/05/word-image-4200-768x473.png 768w, /wp-content/uploads/2018/05/word-image-4200-1024x630.png 1024w" sizes="(max-width: 1046px) 100vw, 1046px" /><br />
<img loading="lazy" decoding="async" width="1048" height="383" src="/wp-content/uploads/2018/05/word-image-4201.png" class="wp-image-4675" srcset="/wp-content/uploads/2018/05/word-image-4201.png 1048w, /wp-content/uploads/2018/05/word-image-4201-300x110.png 300w, /wp-content/uploads/2018/05/word-image-4201-768x281.png 768w, /wp-content/uploads/2018/05/word-image-4201-1024x374.png 1024w" sizes="(max-width: 1048px) 100vw, 1048px" /></p>
<p>
  ④修改模板中代码实现图片的切换
</p>
<p><img loading="lazy" decoding="async" width="1034" height="683" src="/wp-content/uploads/2018/05/word-image-4202.png" class="wp-image-4676" srcset="/wp-content/uploads/2018/05/word-image-4202.png 1034w, /wp-content/uploads/2018/05/word-image-4202-300x198.png 300w, /wp-content/uploads/2018/05/word-image-4202-768x507.png 768w, /wp-content/uploads/2018/05/word-image-4202-1024x676.png 1024w" sizes="(max-width: 1034px) 100vw, 1034px" /></p>
<h1>商品删除</h1>
<p>
  ①增加删除的连接地址
</p>
<p><img loading="lazy" decoding="async" width="1055" height="644" src="/wp-content/uploads/2018/05/word-image-4203.png" class="wp-image-4677" srcset="/wp-content/uploads/2018/05/word-image-4203.png 1055w, /wp-content/uploads/2018/05/word-image-4203-300x183.png 300w, /wp-content/uploads/2018/05/word-image-4203-768x469.png 768w, /wp-content/uploads/2018/05/word-image-4203-1024x625.png 1024w" sizes="(max-width: 1055px) 100vw, 1055px" /></p>
<p>
  ②增加方法进行删除
</p>
<p><img loading="lazy" decoding="async" width="1016" height="404" src="/wp-content/uploads/2018/05/word-image-4204.png" class="wp-image-4678" srcset="/wp-content/uploads/2018/05/word-image-4204.png 1016w, /wp-content/uploads/2018/05/word-image-4204-300x119.png 300w, /wp-content/uploads/2018/05/word-image-4204-768x305.png 768w" sizes="(max-width: 1016px) 100vw, 1016px" /></p>
<p>
  ③修改模板
</p>
<p><img loading="lazy" decoding="async" width="1072" height="693" src="/wp-content/uploads/2018/05/word-image-4205.png" class="wp-image-4679" srcset="/wp-content/uploads/2018/05/word-image-4205.png 1072w, /wp-content/uploads/2018/05/word-image-4205-300x194.png 300w, /wp-content/uploads/2018/05/word-image-4205-768x496.png 768w, /wp-content/uploads/2018/05/word-image-4205-1024x662.png 1024w" sizes="(max-width: 1072px) 100vw, 1072px" /></p>
<p>
  ④修改Goods模型下的where条件
</p>
<p><img loading="lazy" decoding="async" width="1078" height="696" src="/wp-content/uploads/2018/05/word-image-4206.png" class="wp-image-4680" srcset="/wp-content/uploads/2018/05/word-image-4206.png 1078w, /wp-content/uploads/2018/05/word-image-4206-300x194.png 300w, /wp-content/uploads/2018/05/word-image-4206-768x496.png 768w, /wp-content/uploads/2018/05/word-image-4206-1024x661.png 1024w" sizes="(max-width: 1078px) 100vw, 1078px" /></p>
<p>
  去掉了上下架的条件
</p>
<p>
  ⑤再次修改模板
</p>
<p><img loading="lazy" decoding="async" width="1046" height="697" src="/wp-content/uploads/2018/05/word-image-4207.png" class="wp-image-4681" srcset="/wp-content/uploads/2018/05/word-image-4207.png 1046w, /wp-content/uploads/2018/05/word-image-4207-300x200.png 300w, /wp-content/uploads/2018/05/word-image-4207-768x512.png 768w, /wp-content/uploads/2018/05/word-image-4207-1024x682.png 1024w" sizes="(max-width: 1046px) 100vw, 1046px" /></p>
<h1>商品回收站</h1>
<h2>4.1、商品回收站列表显示</h2>
<p>
  ①创建方法
</p>
<p><img loading="lazy" decoding="async" width="1003" height="529" src="/wp-content/uploads/2018/05/word-image-4208.png" class="wp-image-4682" srcset="/wp-content/uploads/2018/05/word-image-4208.png 1003w, /wp-content/uploads/2018/05/word-image-4208-300x158.png 300w, /wp-content/uploads/2018/05/word-image-4208-768x405.png 768w" sizes="(max-width: 1003px) 100vw, 1003px" /></p>
<p>
  ②修改模型获取数据方法
</p>
<p><img loading="lazy" decoding="async" width="1036" height="421" src="/wp-content/uploads/2018/05/word-image-4209.png" class="wp-image-4683" srcset="/wp-content/uploads/2018/05/word-image-4209.png 1036w, /wp-content/uploads/2018/05/word-image-4209-300x122.png 300w, /wp-content/uploads/2018/05/word-image-4209-768x312.png 768w, /wp-content/uploads/2018/05/word-image-4209-1024x416.png 1024w" sizes="(max-width: 1036px) 100vw, 1036px" /></p>
<p>
  ③拷贝模板并且修改
</p>
<p><img loading="lazy" decoding="async" width="1060" height="615" src="/wp-content/uploads/2018/05/word-image-4210.png" class="wp-image-4684" srcset="/wp-content/uploads/2018/05/word-image-4210.png 1060w, /wp-content/uploads/2018/05/word-image-4210-300x174.png 300w, /wp-content/uploads/2018/05/word-image-4210-768x446.png 768w, /wp-content/uploads/2018/05/word-image-4210-1024x594.png 1024w" sizes="(max-width: 1060px) 100vw, 1060px" /></p>
<p>
  在index模板基础上修改操作即可
</p>
<h2>4.2、商品的还原功能</h2>
<p>
  ①修改回收站商品列表
</p>
<p><img loading="lazy" decoding="async" width="1060" height="377" src="/wp-content/uploads/2018/05/word-image-4211.png" class="wp-image-4685" srcset="/wp-content/uploads/2018/05/word-image-4211.png 1060w, /wp-content/uploads/2018/05/word-image-4211-300x107.png 300w, /wp-content/uploads/2018/05/word-image-4211-768x273.png 768w, /wp-content/uploads/2018/05/word-image-4211-1024x364.png 1024w" sizes="(max-width: 1060px) 100vw, 1060px" /></p>
<p>
  ②修改dels方法
</p>
<p><img loading="lazy" decoding="async" width="1090" height="623" src="/wp-content/uploads/2018/05/word-image-4212.png" class="wp-image-4686" srcset="/wp-content/uploads/2018/05/word-image-4212.png 1090w, /wp-content/uploads/2018/05/word-image-4212-300x171.png 300w, /wp-content/uploads/2018/05/word-image-4212-768x439.png 768w, /wp-content/uploads/2018/05/word-image-4212-1024x585.png 1024w" sizes="(max-width: 1090px) 100vw, 1090px" /></p>
<h2>4.3、彻底删除</h2>
<p>
  ①修改模板对彻底删除增加连接地址
</p>
<p><img loading="lazy" decoding="async" width="1049" height="380" src="/wp-content/uploads/2018/05/word-image-4213.png" class="wp-image-4687" srcset="/wp-content/uploads/2018/05/word-image-4213.png 1049w, /wp-content/uploads/2018/05/word-image-4213-300x109.png 300w, /wp-content/uploads/2018/05/word-image-4213-768x278.png 768w, /wp-content/uploads/2018/05/word-image-4213-1024x371.png 1024w" sizes="(max-width: 1049px) 100vw, 1049px" /></p>
<p>
  ②添加方法实现删除
</p>
<p><img loading="lazy" decoding="async" width="996" height="475" src="/wp-content/uploads/2018/05/word-image-4214.png" class="wp-image-4688" srcset="/wp-content/uploads/2018/05/word-image-4214.png 996w, /wp-content/uploads/2018/05/word-image-4214-300x143.png 300w, /wp-content/uploads/2018/05/word-image-4214-768x366.png 768w" sizes="(max-width: 996px) 100vw, 996px" /></p>
<p>
  ③实现模型下的删除方法
</p>
<p><img loading="lazy" decoding="async" width="1046" height="702" src="/wp-content/uploads/2018/05/word-image-4215.png" class="wp-image-4689" srcset="/wp-content/uploads/2018/05/word-image-4215.png 1046w, /wp-content/uploads/2018/05/word-image-4215-300x201.png 300w, /wp-content/uploads/2018/05/word-image-4215-768x515.png 768w, /wp-content/uploads/2018/05/word-image-4215-1024x687.png 1024w" sizes="(max-width: 1046px) 100vw, 1046px" /></p>
<h1>商品编辑</h1>
<h2>5.1、显示原始商品信息</h2>
<p>
  ①创建方法获取原始数据
</p>
<p><img loading="lazy" decoding="async" width="1050" height="674" src="/wp-content/uploads/2018/05/word-image-4216.png" class="wp-image-4690" srcset="/wp-content/uploads/2018/05/word-image-4216.png 1050w, /wp-content/uploads/2018/05/word-image-4216-300x193.png 300w, /wp-content/uploads/2018/05/word-image-4216-768x493.png 768w, /wp-content/uploads/2018/05/word-image-4216-1024x657.png 1024w" sizes="(max-width: 1050px) 100vw, 1050px" /></p>
<p>
  ②拷贝添加模板并且修改
</p>
<p><img loading="lazy" decoding="async" width="1030" height="653" src="/wp-content/uploads/2018/05/word-image-4217.png" class="wp-image-4691" srcset="/wp-content/uploads/2018/05/word-image-4217.png 1030w, /wp-content/uploads/2018/05/word-image-4217-300x190.png 300w, /wp-content/uploads/2018/05/word-image-4217-768x487.png 768w, /wp-content/uploads/2018/05/word-image-4217-1024x649.png 1024w" sizes="(max-width: 1030px) 100vw, 1030px" /><br />
<img loading="lazy" decoding="async" width="1052" height="585" src="/wp-content/uploads/2018/05/word-image-4218.png" class="wp-image-4692" srcset="/wp-content/uploads/2018/05/word-image-4218.png 1052w, /wp-content/uploads/2018/05/word-image-4218-300x167.png 300w, /wp-content/uploads/2018/05/word-image-4218-768x427.png 768w, /wp-content/uploads/2018/05/word-image-4218-1024x569.png 1024w" sizes="(max-width: 1052px) 100vw, 1052px" /><br />
<img loading="lazy" decoding="async" width="1055" height="614" src="/wp-content/uploads/2018/05/word-image-4219.png" class="wp-image-4693" srcset="/wp-content/uploads/2018/05/word-image-4219.png 1055w, /wp-content/uploads/2018/05/word-image-4219-300x175.png 300w, /wp-content/uploads/2018/05/word-image-4219-768x447.png 768w, /wp-content/uploads/2018/05/word-image-4219-1024x596.png 1024w" sizes="(max-width: 1055px) 100vw, 1055px" /><br />
<img loading="lazy" decoding="async" width="1044" height="571" src="/wp-content/uploads/2018/05/word-image-4220.png" class="wp-image-4694" srcset="/wp-content/uploads/2018/05/word-image-4220.png 1044w, /wp-content/uploads/2018/05/word-image-4220-300x164.png 300w, /wp-content/uploads/2018/05/word-image-4220-768x420.png 768w, /wp-content/uploads/2018/05/word-image-4220-1024x560.png 1024w" sizes="(max-width: 1044px) 100vw, 1044px" /><br />
<img loading="lazy" decoding="async" width="1043" height="526" src="/wp-content/uploads/2018/05/word-image-4221.png" class="wp-image-4695" srcset="/wp-content/uploads/2018/05/word-image-4221.png 1043w, /wp-content/uploads/2018/05/word-image-4221-300x151.png 300w, /wp-content/uploads/2018/05/word-image-4221-768x387.png 768w, /wp-content/uploads/2018/05/word-image-4221-1024x516.png 1024w" sizes="(max-width: 1043px) 100vw, 1043px" /><br />
<img loading="lazy" decoding="async" width="1060" height="597" src="/wp-content/uploads/2018/05/word-image-4222.png" class="wp-image-4696" srcset="/wp-content/uploads/2018/05/word-image-4222.png 1060w, /wp-content/uploads/2018/05/word-image-4222-300x169.png 300w, /wp-content/uploads/2018/05/word-image-4222-768x433.png 768w, /wp-content/uploads/2018/05/word-image-4222-1024x577.png 1024w" sizes="(max-width: 1060px) 100vw, 1060px" /><br />
<img loading="lazy" decoding="async" width="1050" height="314" src="/wp-content/uploads/2018/05/word-image-4223.png" class="wp-image-4697" srcset="/wp-content/uploads/2018/05/word-image-4223.png 1050w, /wp-content/uploads/2018/05/word-image-4223-300x90.png 300w, /wp-content/uploads/2018/05/word-image-4223-768x230.png 768w, /wp-content/uploads/2018/05/word-image-4223-1024x306.png 1024w" sizes="(max-width: 1050px) 100vw, 1050px" /></p>
<h2>5.2、实现修改入库</h2>
<p>
  ①修改编辑的方法处理表单提交
</p>
<p><img loading="lazy" decoding="async" width="928" height="597" src="/wp-content/uploads/2018/05/word-image-4224.png" class="wp-image-4698" srcset="/wp-content/uploads/2018/05/word-image-4224.png 928w, /wp-content/uploads/2018/05/word-image-4224-300x193.png 300w, /wp-content/uploads/2018/05/word-image-4224-768x494.png 768w" sizes="(max-width: 928px) 100vw, 928px" /></p>
<p>
  ②增加方法实现修改
</p>
<p><img loading="lazy" decoding="async" width="1068" height="696" src="/wp-content/uploads/2018/05/word-image-4225.png" class="wp-image-4699" srcset="/wp-content/uploads/2018/05/word-image-4225.png 1068w, /wp-content/uploads/2018/05/word-image-4225-300x196.png 300w, /wp-content/uploads/2018/05/word-image-4225-768x500.png 768w, /wp-content/uploads/2018/05/word-image-4225-1024x667.png 1024w" sizes="(max-width: 1068px) 100vw, 1068px" /><br />
<img loading="lazy" decoding="async" width="1055" height="197" src="/wp-content/uploads/2018/05/word-image-4226.png" class="wp-image-4700" srcset="/wp-content/uploads/2018/05/word-image-4226.png 1055w, /wp-content/uploads/2018/05/word-image-4226-300x56.png 300w, /wp-content/uploads/2018/05/word-image-4226-768x143.png 768w, /wp-content/uploads/2018/05/word-image-4226-1024x191.png 1024w" sizes="(max-width: 1055px) 100vw, 1055px" /></p>
<h1>商品类型</h1>
<h2>6.1、商品类型介绍</h2>
<p>
  商品归属于某一个分类。通过分类可以方便用户在前台界面中对商品进行筛选。当描述商品信息时，需要将商品的具体信息表述出。例如手机又cpu、内存、存储大小，衣服有颜色，尺码。对于要描述的内容可以称为属性。
</p>
<p>
  为了描述出属性信息，可以在商品表中使用字段记录对应的信息。如果使用此方式会导致数据表特别庞大并且有很多字段时无用的。
</p>
<p>
  因此可以将属性信息保存到一格单独的数据表中(每一条记录就是一个属性)。如果只有商品表跟属性表还不能完整的描述出商品信息
</p>
<p>
  因此可以对属性做一个归类。归类及抽象一个类型出来。一个商品属于某一个类型就可以使用类型下对应的属性对商品进行描述
</p>
<p>
  注意：类型只是在后台中使用，目的是为了方便管理属性
</p>
<h2>6.2、创建类型数据表</h2>
<p>
  CREATE TABLE `shop_type` (
</p>
<p>
    `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
</p>
<p>
    `type_name` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;类型名称&#8217;,
</p>
<p>
    PRIMARY KEY (`id`)
</p>
<p>
  ) ENGINE=InnoDB AUTO_INCREMENT=3 DEFAULT CHARSET=utf8;
</p>
<h2>6.3、类型的添加与修改</h2>
<p>
  ①控制中实现根据添加与修改时显示模板
</p>
<p><img loading="lazy" decoding="async" width="939" height="681" src="/wp-content/uploads/2018/05/word-image-4227.png" class="wp-image-4701" srcset="/wp-content/uploads/2018/05/word-image-4227.png 939w, /wp-content/uploads/2018/05/word-image-4227-300x218.png 300w, /wp-content/uploads/2018/05/word-image-4227-768x557.png 768w" sizes="(max-width: 939px) 100vw, 939px" /></p>
<p>
  ②模板中展示出数据
</p>
<p><img loading="lazy" decoding="async" width="1044" height="613" src="/wp-content/uploads/2018/05/word-image-4228.png" class="wp-image-4702" srcset="/wp-content/uploads/2018/05/word-image-4228.png 1044w, /wp-content/uploads/2018/05/word-image-4228-300x176.png 300w, /wp-content/uploads/2018/05/word-image-4228-768x451.png 768w, /wp-content/uploads/2018/05/word-image-4228-1024x601.png 1024w" sizes="(max-width: 1044px) 100vw, 1044px" /></p>
<p>
  ③创建自定义模型
</p>
<p><img loading="lazy" decoding="async" width="977" height="619" src="/wp-content/uploads/2018/05/word-image-4229.png" class="wp-image-4703" srcset="/wp-content/uploads/2018/05/word-image-4229.png 977w, /wp-content/uploads/2018/05/word-image-4229-300x190.png 300w, /wp-content/uploads/2018/05/word-image-4229-768x487.png 768w" sizes="(max-width: 977px) 100vw, 977px" /></p>
<p>
  ④实现数据的入库
</p>
<p><img loading="lazy" decoding="async" width="956" height="690" src="/wp-content/uploads/2018/05/word-image-4230.png" class="wp-image-4704" srcset="/wp-content/uploads/2018/05/word-image-4230.png 956w, /wp-content/uploads/2018/05/word-image-4230-300x217.png 300w, /wp-content/uploads/2018/05/word-image-4230-768x554.png 768w" sizes="(max-width: 956px) 100vw, 956px" /></p>
]]></content:encoded>
					
					<wfw:commentRss>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4627.html/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>TP3.2商城 （三）类型管理、属性管理、商品属性</title>
		<link>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4552.html</link>
					<comments>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4552.html#respond</comments>
		
		<dc:creator><![CDATA[Mr.Lee]]></dc:creator>
		<pubDate>Sat, 19 May 2018 12:53:50 +0000</pubDate>
				<category><![CDATA[TP3.2]]></category>
		<category><![CDATA[TP3.2商城]]></category>
		<category><![CDATA[后台框架]]></category>
		<category><![CDATA[商品属性]]></category>
		<category><![CDATA[属性管理]]></category>
		<category><![CDATA[类型管理]]></category>
		<guid isPermaLink="false">/?p=4552</guid>

					<description><![CDATA[类型管理 1.1、类型的列表显示 ①增加方法 ②修改模型增加listData方法 ③处理模板 效果如下 1.2 [&#8230;]]]></description>
										<content:encoded><![CDATA[<h1>类型管理</h1>
<h2>1.1、类型的列表显示</h2>
<p>
  ①增加方法
</p>
<p><img loading="lazy" decoding="async" width="686" height="494" src="/wp-content/uploads/2018/05/word-image-4081.png" class="wp-image-4553" srcset="/wp-content/uploads/2018/05/word-image-4081.png 686w, /wp-content/uploads/2018/05/word-image-4081-300x216.png 300w" sizes="(max-width: 686px) 100vw, 686px" /></p>
<p>
  ②修改模型增加listData方法
</p>
<p><img loading="lazy" decoding="async" width="884" height="658" src="/wp-content/uploads/2018/05/word-image-4082.png" class="wp-image-4554" srcset="/wp-content/uploads/2018/05/word-image-4082.png 884w, /wp-content/uploads/2018/05/word-image-4082-300x223.png 300w, /wp-content/uploads/2018/05/word-image-4082-768x572.png 768w" sizes="(max-width: 884px) 100vw, 884px" /></p>
<p>
  ③处理模板
</p>
<p><img loading="lazy" decoding="async" width="1076" height="673" src="/wp-content/uploads/2018/05/word-image-4083.png" class="wp-image-4555" srcset="/wp-content/uploads/2018/05/word-image-4083.png 1076w, /wp-content/uploads/2018/05/word-image-4083-300x188.png 300w, /wp-content/uploads/2018/05/word-image-4083-768x480.png 768w, /wp-content/uploads/2018/05/word-image-4083-1024x640.png 1024w" sizes="(max-width: 1076px) 100vw, 1076px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="1334" height="265" src="/wp-content/uploads/2018/05/word-image-4084.png" class="wp-image-4556" srcset="/wp-content/uploads/2018/05/word-image-4084.png 1334w, /wp-content/uploads/2018/05/word-image-4084-300x60.png 300w, /wp-content/uploads/2018/05/word-image-4084-768x153.png 768w, /wp-content/uploads/2018/05/word-image-4084-1024x203.png 1024w" sizes="(max-width: 1334px) 100vw, 1334px" /></p>
<h2>1.2、类型的删除</h2>
<p>
  ①创建方法
</p>
<p><img loading="lazy" decoding="async" width="841" height="588" src="/wp-content/uploads/2018/05/word-image-4085.png" class="wp-image-4557" srcset="/wp-content/uploads/2018/05/word-image-4085.png 841w, /wp-content/uploads/2018/05/word-image-4085-300x210.png 300w, /wp-content/uploads/2018/05/word-image-4085-768x537.png 768w" sizes="(max-width: 841px) 100vw, 841px" /></p>
<p>
  ②定义模型的dels方法实现删除
</p>
<p><img loading="lazy" decoding="async" width="926" height="376" src="/wp-content/uploads/2018/05/word-image-4086.png" class="wp-image-4558" srcset="/wp-content/uploads/2018/05/word-image-4086.png 926w, /wp-content/uploads/2018/05/word-image-4086-300x122.png 300w, /wp-content/uploads/2018/05/word-image-4086-768x312.png 768w" sizes="(max-width: 926px) 100vw, 926px" /></p>
<h2>1.3、批量删除功能</h2>
<p>
  ①修改模板
</p>
<p><img loading="lazy" decoding="async" width="1123" height="646" src="/wp-content/uploads/2018/05/word-image-4087.png" class="wp-image-4559" srcset="/wp-content/uploads/2018/05/word-image-4087.png 1123w, /wp-content/uploads/2018/05/word-image-4087-300x173.png 300w, /wp-content/uploads/2018/05/word-image-4087-768x442.png 768w, /wp-content/uploads/2018/05/word-image-4087-1024x589.png 1024w" sizes="(max-width: 1123px) 100vw, 1123px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="1249" height="160" src="/wp-content/uploads/2018/05/word-image-4088.png" class="wp-image-4560" srcset="/wp-content/uploads/2018/05/word-image-4088.png 1249w, /wp-content/uploads/2018/05/word-image-4088-300x38.png 300w, /wp-content/uploads/2018/05/word-image-4088-768x98.png 768w, /wp-content/uploads/2018/05/word-image-4088-1024x131.png 1024w" sizes="(max-width: 1249px) 100vw, 1249px" /></p>
<p>
  ②实现全选
</p>
<p><img loading="lazy" decoding="async" width="945" height="365" src="/wp-content/uploads/2018/05/word-image-4089.png" class="wp-image-4561" srcset="/wp-content/uploads/2018/05/word-image-4089.png 945w, /wp-content/uploads/2018/05/word-image-4089-300x116.png 300w, /wp-content/uploads/2018/05/word-image-4089-768x297.png 768w" sizes="(max-width: 945px) 100vw, 945px" /></p>
<p>
  ③实现反选
</p>
<p><img loading="lazy" decoding="async" width="975" height="551" src="/wp-content/uploads/2018/05/word-image-4090.png" class="wp-image-4562" srcset="/wp-content/uploads/2018/05/word-image-4090.png 975w, /wp-content/uploads/2018/05/word-image-4090-300x170.png 300w, /wp-content/uploads/2018/05/word-image-4090-768x434.png 768w" sizes="(max-width: 975px) 100vw, 975px" /></p>
<p>
  ④点击删除触发ajax
</p>
<p><img loading="lazy" decoding="async" width="985" height="702" src="/wp-content/uploads/2018/05/word-image-4091.png" class="wp-image-4563" srcset="/wp-content/uploads/2018/05/word-image-4091.png 985w, /wp-content/uploads/2018/05/word-image-4091-300x214.png 300w, /wp-content/uploads/2018/05/word-image-4091-768x547.png 768w" sizes="(max-width: 985px) 100vw, 985px" /></p>
<p>
  ⑤修改dels方法
</p>
<p><img loading="lazy" decoding="async" width="1015" height="678" src="/wp-content/uploads/2018/05/word-image-4092.png" class="wp-image-4564" srcset="/wp-content/uploads/2018/05/word-image-4092.png 1015w, /wp-content/uploads/2018/05/word-image-4092-300x200.png 300w, /wp-content/uploads/2018/05/word-image-4092-768x513.png 768w" sizes="(max-width: 1015px) 100vw, 1015px" /></p>
<p>
  ⑥修改模型中的dels方法
</p>
<p><img loading="lazy" decoding="async" width="935" height="610" src="/wp-content/uploads/2018/05/word-image-4093.png" class="wp-image-4565" srcset="/wp-content/uploads/2018/05/word-image-4093.png 935w, /wp-content/uploads/2018/05/word-image-4093-300x196.png 300w, /wp-content/uploads/2018/05/word-image-4093-768x501.png 768w" sizes="(max-width: 935px) 100vw, 935px" /></p>
<p>
  ⑦修改前台的js
</p>
<p><img loading="lazy" decoding="async" width="1004" height="610" src="/wp-content/uploads/2018/05/word-image-4094.png" class="wp-image-4566" srcset="/wp-content/uploads/2018/05/word-image-4094.png 1004w, /wp-content/uploads/2018/05/word-image-4094-300x182.png 300w, /wp-content/uploads/2018/05/word-image-4094-768x467.png 768w" sizes="(max-width: 1004px) 100vw, 1004px" /></p>
<h1>属性管理</h1>
<h2>2.1、属性了解</h2>
<p>
  属性作用是用于描述商品信息
</p>
<h3>2.1.1、单选属性</h3>
<p><img loading="lazy" decoding="async" width="643" height="393" src="/wp-content/uploads/2018/05/word-image-4095.png" class="wp-image-4567" srcset="/wp-content/uploads/2018/05/word-image-4095.png 643w, /wp-content/uploads/2018/05/word-image-4095-300x183.png 300w" sizes="(max-width: 643px) 100vw, 643px" /></p>
<h3>2.1.2、唯一属性</h3>
<p><img loading="lazy" decoding="async" width="1002" height="198" src="/wp-content/uploads/2018/05/word-image-4096.png" class="wp-image-4568" srcset="/wp-content/uploads/2018/05/word-image-4096.png 1002w, /wp-content/uploads/2018/05/word-image-4096-300x59.png 300w, /wp-content/uploads/2018/05/word-image-4096-768x152.png 768w" sizes="(max-width: 1002px) 100vw, 1002px" /></p>
<h2>2.2、属性的录入方式</h2>
<p>
  属性录入方式可以划分为两种。一种手工输入另外一种就是列表选择
</p>
<p>
  关于属性的录入方式就是当描述商品时对应的内容，是使用选择框(列表选择)还是文本框(手工输入)
</p>
<p>
  对于属性内容是属于固定的某几个可以使用列表选择
</p>
<p>
  对于属性的内容是不固定可以使用手工输入
</p>
<p><img loading="lazy" decoding="async" width="941" height="374" src="/wp-content/uploads/2018/05/word-image-4097.png" class="wp-image-4569" srcset="/wp-content/uploads/2018/05/word-image-4097.png 941w, /wp-content/uploads/2018/05/word-image-4097-300x119.png 300w, /wp-content/uploads/2018/05/word-image-4097-768x305.png 768w" sizes="(max-width: 941px) 100vw, 941px" /></p>
<h2>2.3、实现属性入库功能</h2>
<h3>2.3.1、创建属性的数据表</h3>
<p>
  CREATE TABLE `shop_attribute` (
</p>
<p>
    `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
</p>
<p>
    `attr_name` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;属性名称&#8217;,
</p>
<p>
    `type_id` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;属性的所属类型 对应shop_type表中的id字段&#8217;,
</p>
<p>
    `attr_type` tinyint(4) NOT NULL DEFAULT &#8216;1&#8217; COMMENT &#8216;属性本身的类型  1唯一属性 2、单选属性&#8217;,
</p>
<p>
    `attr_input_type` tinyint(4) NOT NULL DEFAULT &#8216;1&#8217; COMMENT &#8216;属性的录入方式 1手工输入  2列表选择&#8217;,
</p>
<p>
    `attr_values` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;属性的默认值 多个值使用逗号隔开&#8217;,
</p>
<p>
    PRIMARY KEY (`id`)
</p>
<p>
  ) ENGINE=InnoDB DEFAULT CHARSET=utf8;
</p>
<h3>2.3.2、显示属性的添加表单</h3>
<p>
  ①创建控制器方法显示模板
</p>
<p><img loading="lazy" decoding="async" width="978" height="551" src="/wp-content/uploads/2018/05/word-image-4098.png" class="wp-image-4570" srcset="/wp-content/uploads/2018/05/word-image-4098.png 978w, /wp-content/uploads/2018/05/word-image-4098-300x169.png 300w, /wp-content/uploads/2018/05/word-image-4098-768x433.png 768w" sizes="(max-width: 978px) 100vw, 978px" /></p>
<p>
  ②创建模板
</p>
<p><img loading="lazy" decoding="async" width="1091" height="683" src="/wp-content/uploads/2018/05/word-image-4099.png" class="wp-image-4571" srcset="/wp-content/uploads/2018/05/word-image-4099.png 1091w, /wp-content/uploads/2018/05/word-image-4099-300x188.png 300w, /wp-content/uploads/2018/05/word-image-4099-768x481.png 768w, /wp-content/uploads/2018/05/word-image-4099-1024x641.png 1024w" sizes="(max-width: 1091px) 100vw, 1091px" /><br />
<img loading="lazy" decoding="async" width="1067" height="633" src="/wp-content/uploads/2018/05/word-image-4100.png" class="wp-image-4572" srcset="/wp-content/uploads/2018/05/word-image-4100.png 1067w, /wp-content/uploads/2018/05/word-image-4100-300x178.png 300w, /wp-content/uploads/2018/05/word-image-4100-768x456.png 768w, /wp-content/uploads/2018/05/word-image-4100-1024x607.png 1024w" sizes="(max-width: 1067px) 100vw, 1067px" /><br />
<img loading="lazy" decoding="async" width="965" height="343" src="/wp-content/uploads/2018/05/word-image-4101.png" class="wp-image-4573" srcset="/wp-content/uploads/2018/05/word-image-4101.png 965w, /wp-content/uploads/2018/05/word-image-4101-300x107.png 300w, /wp-content/uploads/2018/05/word-image-4101-768x273.png 768w" sizes="(max-width: 965px) 100vw, 965px" /></p>
<p>
  ③修改默认值增加id属性
</p>
<p><img loading="lazy" decoding="async" width="1043" height="510" src="/wp-content/uploads/2018/05/word-image-4102.png" class="wp-image-4574" srcset="/wp-content/uploads/2018/05/word-image-4102.png 1043w, /wp-content/uploads/2018/05/word-image-4102-300x147.png 300w, /wp-content/uploads/2018/05/word-image-4102-768x376.png 768w, /wp-content/uploads/2018/05/word-image-4102-1024x501.png 1024w" sizes="(max-width: 1043px) 100vw, 1043px" /></p>
<p>
  ④使用js实现禁用与取消
</p>
<p><img loading="lazy" decoding="async" width="961" height="640" src="/wp-content/uploads/2018/05/word-image-4103.png" class="wp-image-4575" srcset="/wp-content/uploads/2018/05/word-image-4103.png 961w, /wp-content/uploads/2018/05/word-image-4103-300x200.png 300w, /wp-content/uploads/2018/05/word-image-4103-768x511.png 768w" sizes="(max-width: 961px) 100vw, 961px" /></p>
<h3>2.3.3、实现添加的入库</h3>
<p>
  ①修改add方法
</p>
<p><img loading="lazy" decoding="async" width="1044" height="658" src="/wp-content/uploads/2018/05/word-image-4104.png" class="wp-image-4576" srcset="/wp-content/uploads/2018/05/word-image-4104.png 1044w, /wp-content/uploads/2018/05/word-image-4104-300x189.png 300w, /wp-content/uploads/2018/05/word-image-4104-768x484.png 768w, /wp-content/uploads/2018/05/word-image-4104-1024x645.png 1024w" sizes="(max-width: 1044px) 100vw, 1044px" /></p>
<p>
  ②创建模型编写自动验证
</p>
<p><img loading="lazy" decoding="async" width="1033" height="616" src="/wp-content/uploads/2018/05/word-image-4105.png" class="wp-image-4577" srcset="/wp-content/uploads/2018/05/word-image-4105.png 1033w, /wp-content/uploads/2018/05/word-image-4105-300x179.png 300w, /wp-content/uploads/2018/05/word-image-4105-768x458.png 768w, /wp-content/uploads/2018/05/word-image-4105-1024x611.png 1024w" sizes="(max-width: 1033px) 100vw, 1033px" /></p>
<h2>2.4、属性列表显示功能</h2>
<p>
  ①创建方法获取数据显示模板
</p>
<p><img loading="lazy" decoding="async" width="741" height="334" src="/wp-content/uploads/2018/05/word-image-4106.png" class="wp-image-4578" srcset="/wp-content/uploads/2018/05/word-image-4106.png 741w, /wp-content/uploads/2018/05/word-image-4106-300x135.png 300w" sizes="(max-width: 741px) 100vw, 741px" /></p>
<p>
  ②创建listData方法
</p>
<p><img loading="lazy" decoding="async" width="1003" height="597" src="/wp-content/uploads/2018/05/word-image-4107.png" class="wp-image-4579" srcset="/wp-content/uploads/2018/05/word-image-4107.png 1003w, /wp-content/uploads/2018/05/word-image-4107-300x179.png 300w, /wp-content/uploads/2018/05/word-image-4107-768x457.png 768w" sizes="(max-width: 1003px) 100vw, 1003px" /></p>
<p>
  ③处理模板显示
</p>
<p><img loading="lazy" decoding="async" width="1084" height="684" src="/wp-content/uploads/2018/05/word-image-4108.png" class="wp-image-4580" srcset="/wp-content/uploads/2018/05/word-image-4108.png 1084w, /wp-content/uploads/2018/05/word-image-4108-300x189.png 300w, /wp-content/uploads/2018/05/word-image-4108-768x485.png 768w, /wp-content/uploads/2018/05/word-image-4108-1024x646.png 1024w" sizes="(max-width: 1084px) 100vw, 1084px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="1352" height="349" src="/wp-content/uploads/2018/05/word-image-4109.png" class="wp-image-4581" srcset="/wp-content/uploads/2018/05/word-image-4109.png 1352w, /wp-content/uploads/2018/05/word-image-4109-300x77.png 300w, /wp-content/uploads/2018/05/word-image-4109-768x198.png 768w, /wp-content/uploads/2018/05/word-image-4109-1024x264.png 1024w" sizes="(max-width: 1352px) 100vw, 1352px" /></p>
<h2>2.5、属性的删除</h2>
<p>
  ①修改模板中的连接地址
</p>
<p><img loading="lazy" decoding="async" width="1093" height="268" src="/wp-content/uploads/2018/05/word-image-4110.png" class="wp-image-4582" srcset="/wp-content/uploads/2018/05/word-image-4110.png 1093w, /wp-content/uploads/2018/05/word-image-4110-300x74.png 300w, /wp-content/uploads/2018/05/word-image-4110-768x188.png 768w, /wp-content/uploads/2018/05/word-image-4110-1024x251.png 1024w" sizes="(max-width: 1093px) 100vw, 1093px" /></p>
<p>
  ②创建方法实现删除
</p>
<p><img loading="lazy" decoding="async" width="899" height="706" src="/wp-content/uploads/2018/05/word-image-4111.png" class="wp-image-4583" srcset="/wp-content/uploads/2018/05/word-image-4111.png 899w, /wp-content/uploads/2018/05/word-image-4111-300x236.png 300w, /wp-content/uploads/2018/05/word-image-4111-768x603.png 768w" sizes="(max-width: 899px) 100vw, 899px" /></p>
<p>
  ③在模型下实现删除
</p>
<p><img loading="lazy" decoding="async" width="956" height="520" src="/wp-content/uploads/2018/05/word-image-4112.png" class="wp-image-4584" srcset="/wp-content/uploads/2018/05/word-image-4112.png 956w, /wp-content/uploads/2018/05/word-image-4112-300x163.png 300w, /wp-content/uploads/2018/05/word-image-4112-768x418.png 768w" sizes="(max-width: 956px) 100vw, 956px" /></p>
<h2>2.6、属性编辑</h2>
<h3>2.6.1、显示原始数据</h3>
<p>
  ①创建方法获取原始数据
</p>
<p><img loading="lazy" decoding="async" width="1037" height="536" src="/wp-content/uploads/2018/05/word-image-4113.png" class="wp-image-4585" srcset="/wp-content/uploads/2018/05/word-image-4113.png 1037w, /wp-content/uploads/2018/05/word-image-4113-300x155.png 300w, /wp-content/uploads/2018/05/word-image-4113-768x397.png 768w, /wp-content/uploads/2018/05/word-image-4113-1024x529.png 1024w" sizes="(max-width: 1037px) 100vw, 1037px" /></p>
<p>
  ②处理模板
</p>
<p><img loading="lazy" decoding="async" width="1074" height="694" src="/wp-content/uploads/2018/05/word-image-4114.png" class="wp-image-4586" srcset="/wp-content/uploads/2018/05/word-image-4114.png 1074w, /wp-content/uploads/2018/05/word-image-4114-300x194.png 300w, /wp-content/uploads/2018/05/word-image-4114-768x496.png 768w, /wp-content/uploads/2018/05/word-image-4114-1024x662.png 1024w" sizes="(max-width: 1074px) 100vw, 1074px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="647" height="260" src="/wp-content/uploads/2018/05/word-image-4115.png" class="wp-image-4587" srcset="/wp-content/uploads/2018/05/word-image-4115.png 647w, /wp-content/uploads/2018/05/word-image-4115-300x121.png 300w" sizes="(max-width: 647px) 100vw, 647px" /></p>
<h3>2.6.2、实现入库修改</h3>
<p><img loading="lazy" decoding="async" width="1041" height="704" src="/wp-content/uploads/2018/05/word-image-4116.png" class="wp-image-4588" srcset="/wp-content/uploads/2018/05/word-image-4116.png 1041w, /wp-content/uploads/2018/05/word-image-4116-300x203.png 300w, /wp-content/uploads/2018/05/word-image-4116-768x519.png 768w, /wp-content/uploads/2018/05/word-image-4116-1024x693.png 1024w, /wp-content/uploads/2018/05/word-image-4116-220x150.png 220w" sizes="(max-width: 1041px) 100vw, 1041px" /></p>
<h1>商品的属性关联</h1>
<h2>3.1、添加商品时显示类型</h2>
<p>
  ①增加商品属性选项卡
</p>
<p><img loading="lazy" decoding="async" width="967" height="399" src="/wp-content/uploads/2018/05/word-image-4117.png" class="wp-image-4589" srcset="/wp-content/uploads/2018/05/word-image-4117.png 967w, /wp-content/uploads/2018/05/word-image-4117-300x124.png 300w, /wp-content/uploads/2018/05/word-image-4117-768x317.png 768w" sizes="(max-width: 967px) 100vw, 967px" /></p>
<p>
  ②增加商品属性选项卡对应的table
</p>
<p><img loading="lazy" decoding="async" width="1069" height="560" src="/wp-content/uploads/2018/05/word-image-4118.png" class="wp-image-4590" srcset="/wp-content/uploads/2018/05/word-image-4118.png 1069w, /wp-content/uploads/2018/05/word-image-4118-300x157.png 300w, /wp-content/uploads/2018/05/word-image-4118-768x402.png 768w, /wp-content/uploads/2018/05/word-image-4118-1024x536.png 1024w" sizes="(max-width: 1069px) 100vw, 1069px" /></p>
<p>
  ③修改商品添加获取类型
</p>
<p><img loading="lazy" decoding="async" width="1007" height="631" src="/wp-content/uploads/2018/05/word-image-4119.png" class="wp-image-4591" srcset="/wp-content/uploads/2018/05/word-image-4119.png 1007w, /wp-content/uploads/2018/05/word-image-4119-300x188.png 300w, /wp-content/uploads/2018/05/word-image-4119-768x481.png 768w" sizes="(max-width: 1007px) 100vw, 1007px" /></p>
<p>
  ④修改模板循环显示类型
</p>
<p><img loading="lazy" decoding="async" width="1116" height="697" src="/wp-content/uploads/2018/05/word-image-4120.png" class="wp-image-4592" srcset="/wp-content/uploads/2018/05/word-image-4120.png 1116w, /wp-content/uploads/2018/05/word-image-4120-300x187.png 300w, /wp-content/uploads/2018/05/word-image-4120-768x480.png 768w, /wp-content/uploads/2018/05/word-image-4120-1024x640.png 1024w" sizes="(max-width: 1116px) 100vw, 1116px" /></p>
<p>
  ⑤修改商品表结构
</p>
<p><img loading="lazy" decoding="async" width="872" height="312" src="/wp-content/uploads/2018/05/word-image-4121.png" class="wp-image-4593" srcset="/wp-content/uploads/2018/05/word-image-4121.png 872w, /wp-content/uploads/2018/05/word-image-4121-300x107.png 300w, /wp-content/uploads/2018/05/word-image-4121-768x275.png 768w" sizes="(max-width: 872px) 100vw, 872px" /></p>
<p>
  ⑥修改模型中自定义字段
</p>
<p><img loading="lazy" decoding="async" width="1053" height="384" src="/wp-content/uploads/2018/05/word-image-4122.png" class="wp-image-4594" srcset="/wp-content/uploads/2018/05/word-image-4122.png 1053w, /wp-content/uploads/2018/05/word-image-4122-300x109.png 300w, /wp-content/uploads/2018/05/word-image-4122-768x280.png 768w, /wp-content/uploads/2018/05/word-image-4122-1024x373.png 1024w" sizes="(max-width: 1053px) 100vw, 1053px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="1134" height="276" src="/wp-content/uploads/2018/05/word-image-4123.png" class="wp-image-4595" srcset="/wp-content/uploads/2018/05/word-image-4123.png 1134w, /wp-content/uploads/2018/05/word-image-4123-300x73.png 300w, /wp-content/uploads/2018/05/word-image-4123-768x187.png 768w, /wp-content/uploads/2018/05/word-image-4123-1024x249.png 1024w" sizes="(max-width: 1134px) 100vw, 1134px" /></p>
<h2>3.2、实现类型切换属性变化</h2>
<p>
  ①给select增加id属性
</p>
<p><img loading="lazy" decoding="async" width="1019" height="445" src="/wp-content/uploads/2018/05/word-image-4124.png" class="wp-image-4596" srcset="/wp-content/uploads/2018/05/word-image-4124.png 1019w, /wp-content/uploads/2018/05/word-image-4124-300x131.png 300w, /wp-content/uploads/2018/05/word-image-4124-768x335.png 768w" sizes="(max-width: 1019px) 100vw, 1019px" /></p>
<p>
  ②绑定切换事件
</p>
<p><img loading="lazy" decoding="async" width="1091" height="700" src="/wp-content/uploads/2018/05/word-image-4125.png" class="wp-image-4597" srcset="/wp-content/uploads/2018/05/word-image-4125.png 1091w, /wp-content/uploads/2018/05/word-image-4125-300x192.png 300w, /wp-content/uploads/2018/05/word-image-4125-768x493.png 768w, /wp-content/uploads/2018/05/word-image-4125-1024x657.png 1024w" sizes="(max-width: 1091px) 100vw, 1091px" /></p>
<p>
  ③创建方法
</p>
<p><img loading="lazy" decoding="async" width="1064" height="681" src="/wp-content/uploads/2018/05/word-image-4126.png" class="wp-image-4598" srcset="/wp-content/uploads/2018/05/word-image-4126.png 1064w, /wp-content/uploads/2018/05/word-image-4126-300x192.png 300w, /wp-content/uploads/2018/05/word-image-4126-768x492.png 768w, /wp-content/uploads/2018/05/word-image-4126-1024x655.png 1024w" sizes="(max-width: 1064px) 100vw, 1064px" /></p>
<p>
  ④创建视图
</p>
<p><img loading="lazy" decoding="async" width="1046" height="701" src="/wp-content/uploads/2018/05/word-image-4127.png" class="wp-image-4599" srcset="/wp-content/uploads/2018/05/word-image-4127.png 1046w, /wp-content/uploads/2018/05/word-image-4127-300x201.png 300w, /wp-content/uploads/2018/05/word-image-4127-768x515.png 768w, /wp-content/uploads/2018/05/word-image-4127-1024x686.png 1024w" sizes="(max-width: 1046px) 100vw, 1046px" /></p>
<h2>3.3、实现单选属性的增加功能</h2>
<p>
  由于单选属性是用于控制商品购买的。会提供多个值由用户进行选择。因此在数据录入时对于有单选属性的需要设置为可以提交多个内容
</p>
<p>
  ①修改模板
</p>
<p><img loading="lazy" decoding="async" width="1095" height="696" src="/wp-content/uploads/2018/05/word-image-4128.png" class="wp-image-4600" srcset="/wp-content/uploads/2018/05/word-image-4128.png 1095w, /wp-content/uploads/2018/05/word-image-4128-300x191.png 300w, /wp-content/uploads/2018/05/word-image-4128-768x488.png 768w, /wp-content/uploads/2018/05/word-image-4128-1024x651.png 1024w" sizes="(max-width: 1095px) 100vw, 1095px" /></p>
<p>
  ②编写js代码
</p>
<p><img loading="lazy" decoding="async" width="1070" height="696" src="/wp-content/uploads/2018/05/word-image-4129.png" class="wp-image-4601" srcset="/wp-content/uploads/2018/05/word-image-4129.png 1070w, /wp-content/uploads/2018/05/word-image-4129-300x195.png 300w, /wp-content/uploads/2018/05/word-image-4129-768x500.png 768w, /wp-content/uploads/2018/05/word-image-4129-1024x666.png 1024w" sizes="(max-width: 1070px) 100vw, 1070px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="889" height="294" src="/wp-content/uploads/2018/05/word-image-4130.png" class="wp-image-4602" srcset="/wp-content/uploads/2018/05/word-image-4130.png 889w, /wp-content/uploads/2018/05/word-image-4130-300x99.png 300w, /wp-content/uploads/2018/05/word-image-4130-768x254.png 768w" sizes="(max-width: 889px) 100vw, 889px" /></p>
<h2>3.4、商品添加属性值入库功能</h2>
<h3>3.4.1、创建商品属性表</h3>
<p>
  CREATE TABLE `shop_goods_attr` (
</p>
<p>
    `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
</p>
<p>
    `goods_id` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;商品ID&#8217;,
</p>
<p>
    `attr_id` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;属性ID 对应attribute表中的id字段&#8217;,
</p>
<p>
    `attr_value` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;属性值&#8217;,
</p>
<p>
    PRIMARY KEY (`id`)
</p>
<p>
  ) ENGINE=InnoDB DEFAULT CHARSET=utf8;
</p>
<h3>3.4.2、实现可以提交属性ID及值</h3>
<p>
  考虑有多个属性值需要提交因此需要使用数组格式
</p>
<p>
  ①修改模板设置数组格式的name
</p>
<p><img loading="lazy" decoding="async" width="989" height="577" src="/wp-content/uploads/2018/05/word-image-4131.png" class="wp-image-4603" srcset="/wp-content/uploads/2018/05/word-image-4131.png 989w, /wp-content/uploads/2018/05/word-image-4131-300x175.png 300w, /wp-content/uploads/2018/05/word-image-4131-768x448.png 768w" sizes="(max-width: 989px) 100vw, 989px" /></p>
<p>
  ②修改添加的提交方法查看结果
</p>
<p><img loading="lazy" decoding="async" width="842" height="520" src="/wp-content/uploads/2018/05/word-image-4132.png" class="wp-image-4604" srcset="/wp-content/uploads/2018/05/word-image-4132.png 842w, /wp-content/uploads/2018/05/word-image-4132-300x185.png 300w, /wp-content/uploads/2018/05/word-image-4132-768x474.png 768w" sizes="(max-width: 842px) 100vw, 842px" /><br />
<img loading="lazy" decoding="async" width="549" height="273" src="/wp-content/uploads/2018/05/word-image-4133.png" class="wp-image-4605" srcset="/wp-content/uploads/2018/05/word-image-4133.png 549w, /wp-content/uploads/2018/05/word-image-4133-300x149.png 300w" sizes="(max-width: 549px) 100vw, 549px" /></p>
<p>
  ③再次修改name值格式
</p>
<p><img loading="lazy" decoding="async" width="977" height="577" src="/wp-content/uploads/2018/05/word-image-4134.png" class="wp-image-4606" srcset="/wp-content/uploads/2018/05/word-image-4134.png 977w, /wp-content/uploads/2018/05/word-image-4134-300x177.png 300w, /wp-content/uploads/2018/05/word-image-4134-768x454.png 768w" sizes="(max-width: 977px) 100vw, 977px" /></p>
<p>
  ④再次查看结果
</p>
<p><img loading="lazy" decoding="async" width="790" height="296" src="/wp-content/uploads/2018/05/word-image-4135.png" class="wp-image-4607" srcset="/wp-content/uploads/2018/05/word-image-4135.png 790w, /wp-content/uploads/2018/05/word-image-4135-300x112.png 300w, /wp-content/uploads/2018/05/word-image-4135-768x288.png 768w" sizes="(max-width: 790px) 100vw, 790px" /></p>
<p>
  ⑤再次修改name格式
</p>
<p><img loading="lazy" decoding="async" width="1041" height="643" src="/wp-content/uploads/2018/05/word-image-4136.png" class="wp-image-4608" srcset="/wp-content/uploads/2018/05/word-image-4136.png 1041w, /wp-content/uploads/2018/05/word-image-4136-300x185.png 300w, /wp-content/uploads/2018/05/word-image-4136-768x474.png 768w, /wp-content/uploads/2018/05/word-image-4136-1024x632.png 1024w" sizes="(max-width: 1041px) 100vw, 1041px" /></p>
<p>
  ⑥查看结果
</p>
<p><img loading="lazy" decoding="async" width="703" height="359" src="/wp-content/uploads/2018/05/word-image-4137.png" class="wp-image-4609" srcset="/wp-content/uploads/2018/05/word-image-4137.png 703w, /wp-content/uploads/2018/05/word-image-4137-300x153.png 300w" sizes="(max-width: 703px) 100vw, 703px" /></p>
<h3>3.4.3、实现入库</h3>
<p>
  ①查看添加后置钩子函数传输的结果
</p>
<p><img loading="lazy" decoding="async" width="665" height="374" src="/wp-content/uploads/2018/05/word-image-4138.png" class="wp-image-4610" srcset="/wp-content/uploads/2018/05/word-image-4138.png 665w, /wp-content/uploads/2018/05/word-image-4138-300x169.png 300w" sizes="(max-width: 665px) 100vw, 665px" /></p>
<p>
  ②添加后置钩子函数处理属性
</p>
<p><img loading="lazy" decoding="async" width="1051" height="649" src="/wp-content/uploads/2018/05/word-image-4139.png" class="wp-image-4611" srcset="/wp-content/uploads/2018/05/word-image-4139.png 1051w, /wp-content/uploads/2018/05/word-image-4139-300x185.png 300w, /wp-content/uploads/2018/05/word-image-4139-768x474.png 768w, /wp-content/uploads/2018/05/word-image-4139-1024x632.png 1024w" sizes="(max-width: 1051px) 100vw, 1051px" /></p>
<p>
  结果查看数据表即可
</p>
<p><img loading="lazy" decoding="async" width="669" height="403" src="/wp-content/uploads/2018/05/word-image-4140.png" class="wp-image-4612" srcset="/wp-content/uploads/2018/05/word-image-4140.png 669w, /wp-content/uploads/2018/05/word-image-4140-300x181.png 300w" sizes="(max-width: 669px) 100vw, 669px" /></p>
<h2>3.5、商品修改属性入库修改</h2>
<h3>3.5.1、实现显示已有的属性信息</h3>
<p>
  ①修改编辑的方法获取已有的属性信息
</p>
<p><img loading="lazy" decoding="async" width="1056" height="661" src="/wp-content/uploads/2018/05/word-image-4141.png" class="wp-image-4613" srcset="/wp-content/uploads/2018/05/word-image-4141.png 1056w, /wp-content/uploads/2018/05/word-image-4141-300x188.png 300w, /wp-content/uploads/2018/05/word-image-4141-768x481.png 768w, /wp-content/uploads/2018/05/word-image-4141-1024x641.png 1024w" sizes="(max-width: 1056px) 100vw, 1056px" /></p>
<p>
  ②查看结果
</p>
<p><img loading="lazy" decoding="async" width="857" height="615" src="/wp-content/uploads/2018/05/word-image-4142.png" class="wp-image-4614" srcset="/wp-content/uploads/2018/05/word-image-4142.png 857w, /wp-content/uploads/2018/05/word-image-4142-300x215.png 300w, /wp-content/uploads/2018/05/word-image-4142-768x551.png 768w" sizes="(max-width: 857px) 100vw, 857px" /></p>
<p>
  ③继续修改编辑方法获取已有的类型信息
</p>
<p><img loading="lazy" decoding="async" width="1049" height="473" src="/wp-content/uploads/2018/05/word-image-4143.png" class="wp-image-4615" srcset="/wp-content/uploads/2018/05/word-image-4143.png 1049w, /wp-content/uploads/2018/05/word-image-4143-300x135.png 300w, /wp-content/uploads/2018/05/word-image-4143-768x346.png 768w, /wp-content/uploads/2018/05/word-image-4143-1024x462.png 1024w" sizes="(max-width: 1049px) 100vw, 1049px" /></p>
<p>
  ④继续格式化所获取到的属性信息
</p>
<p><img loading="lazy" decoding="async" width="1068" height="627" src="/wp-content/uploads/2018/05/word-image-4144.png" class="wp-image-4616" srcset="/wp-content/uploads/2018/05/word-image-4144.png 1068w, /wp-content/uploads/2018/05/word-image-4144-300x176.png 300w, /wp-content/uploads/2018/05/word-image-4144-768x451.png 768w, /wp-content/uploads/2018/05/word-image-4144-1024x601.png 1024w" sizes="(max-width: 1068px) 100vw, 1068px" /><br />
<img loading="lazy" decoding="async" width="899" height="583" src="/wp-content/uploads/2018/05/word-image-4145.png" class="wp-image-4617" srcset="/wp-content/uploads/2018/05/word-image-4145.png 899w, /wp-content/uploads/2018/05/word-image-4145-300x195.png 300w, /wp-content/uploads/2018/05/word-image-4145-768x498.png 768w" sizes="(max-width: 899px) 100vw, 899px" /></p>
<p>
  ④继续格式化数据
</p>
<p><img loading="lazy" decoding="async" width="1069" height="698" src="/wp-content/uploads/2018/05/word-image-4146.png" class="wp-image-4618" srcset="/wp-content/uploads/2018/05/word-image-4146.png 1069w, /wp-content/uploads/2018/05/word-image-4146-300x196.png 300w, /wp-content/uploads/2018/05/word-image-4146-768x501.png 768w, /wp-content/uploads/2018/05/word-image-4146-1024x669.png 1024w" sizes="(max-width: 1069px) 100vw, 1069px" /></p>
<p>
  格式化效果如下
</p>
<p><img loading="lazy" decoding="async" width="1105" height="703" src="/wp-content/uploads/2018/05/word-image-4147.png" class="wp-image-4619" srcset="/wp-content/uploads/2018/05/word-image-4147.png 1105w, /wp-content/uploads/2018/05/word-image-4147-300x191.png 300w, /wp-content/uploads/2018/05/word-image-4147-768x489.png 768w, /wp-content/uploads/2018/05/word-image-4147-1024x651.png 1024w" sizes="(max-width: 1105px) 100vw, 1105px" /></p>
<p>
  ②模板显示数据
</p>
<p><img loading="lazy" decoding="async" width="1069" height="465" src="/wp-content/uploads/2018/05/word-image-4148.png" class="wp-image-4620" srcset="/wp-content/uploads/2018/05/word-image-4148.png 1069w, /wp-content/uploads/2018/05/word-image-4148-300x130.png 300w, /wp-content/uploads/2018/05/word-image-4148-768x334.png 768w, /wp-content/uploads/2018/05/word-image-4148-1024x445.png 1024w" sizes="(max-width: 1069px) 100vw, 1069px" /><br />
<img loading="lazy" decoding="async" width="1067" height="556" src="/wp-content/uploads/2018/05/word-image-4149.png" class="wp-image-4621" srcset="/wp-content/uploads/2018/05/word-image-4149.png 1067w, /wp-content/uploads/2018/05/word-image-4149-300x156.png 300w, /wp-content/uploads/2018/05/word-image-4149-768x400.png 768w, /wp-content/uploads/2018/05/word-image-4149-1024x534.png 1024w" sizes="(max-width: 1067px) 100vw, 1067px" /><br />
<img loading="lazy" decoding="async" width="1075" height="194" src="/wp-content/uploads/2018/05/word-image-4150.png" class="wp-image-4622" srcset="/wp-content/uploads/2018/05/word-image-4150.png 1075w, /wp-content/uploads/2018/05/word-image-4150-300x54.png 300w, /wp-content/uploads/2018/05/word-image-4150-768x139.png 768w, /wp-content/uploads/2018/05/word-image-4150-1024x185.png 1024w" sizes="(max-width: 1075px) 100vw, 1075px" /></p>
<p>
  最终效果如下
</p>
<p><img loading="lazy" decoding="async" width="975" height="539" src="/wp-content/uploads/2018/05/word-image-4151.png" class="wp-image-4623" srcset="/wp-content/uploads/2018/05/word-image-4151.png 975w, /wp-content/uploads/2018/05/word-image-4151-300x166.png 300w, /wp-content/uploads/2018/05/word-image-4151-768x425.png 768w" sizes="(max-width: 975px) 100vw, 975px" /></p>
<h3>3.5.2、实现属性的入库修改</h3>
<p><img loading="lazy" decoding="async" width="991" height="678" src="/wp-content/uploads/2018/05/word-image-4152.png" class="wp-image-4624" srcset="/wp-content/uploads/2018/05/word-image-4152.png 991w, /wp-content/uploads/2018/05/word-image-4152-300x205.png 300w, /wp-content/uploads/2018/05/word-image-4152-768x525.png 768w, /wp-content/uploads/2018/05/word-image-4152-220x150.png 220w" sizes="(max-width: 991px) 100vw, 991px" /></p>
<h1>总结商品属性之间的关系</h1>
<p><img loading="lazy" decoding="async" width="1141" height="624" src="/wp-content/uploads/2018/05/word-image-4153.png" class="wp-image-4625" srcset="/wp-content/uploads/2018/05/word-image-4153.png 1141w, /wp-content/uploads/2018/05/word-image-4153-300x164.png 300w, /wp-content/uploads/2018/05/word-image-4153-768x420.png 768w, /wp-content/uploads/2018/05/word-image-4153-1024x560.png 1024w" sizes="(max-width: 1141px) 100vw, 1141px" /></p>
]]></content:encoded>
					
					<wfw:commentRss>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4552.html/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>TP3.2商城 （四）RBAC、角色、用户、权限</title>
		<link>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4470.html</link>
					<comments>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4470.html#respond</comments>
		
		<dc:creator><![CDATA[Mr.Lee]]></dc:creator>
		<pubDate>Sat, 19 May 2018 12:48:53 +0000</pubDate>
				<category><![CDATA[TP3.2]]></category>
		<category><![CDATA[TP3.2商城]]></category>
		<category><![CDATA[后台框架]]></category>
		<category><![CDATA[RBAC]]></category>
		<category><![CDATA[权限]]></category>
		<category><![CDATA[用户]]></category>
		<category><![CDATA[角色]]></category>
		<guid isPermaLink="false">/?p=4470</guid>

					<description><![CDATA[RBAC权限认证概述 权限概述 权限也就是用户是否能够访问后台某个页面。权限即控制器中的某一个方法。对于是否有 [&#8230;]]]></description>
										<content:encoded><![CDATA[<h1>RBAC权限认证概述</h1>
<h2>权限概述</h2>
<p>
  权限也就是用户是否能够访问后台某个页面。权限即控制器中的某一个方法。对于是否有权访问访问某个方法的操作经常使用的就是RBAC方式实现
</p>
<h2>RBAC方式控制权限</h2>
<p>
  RBAC基于角色的权限控制系统。一个用户属于某一种角色。而角色对应拥有哪些权限信息。因此用户就拥有了角色所对应的权限信息
</p>
<p>
  <br />
  关于权限说明：权限信息即后台中所对应的控制器及方法。此信息需要保存到数据表中。当检查用户是否具备权限时，通过使用当前用户访问的控制器跟方法名称与已经拥有的权限进行对比即可。在赋予权限过程中。如果直接给用户赋予权限操作麻烦。可以使用角色赋予权限。用户归属角色。用户自动的就拥有了权限
</p>
<p><img loading="lazy" decoding="async" width="1095" height="447" src="/wp-content/uploads/2018/05/word-image-4001.png" class="wp-image-4471" srcset="/wp-content/uploads/2018/05/word-image-4001.png 1095w, /wp-content/uploads/2018/05/word-image-4001-300x122.png 300w, /wp-content/uploads/2018/05/word-image-4001-768x314.png 768w, /wp-content/uploads/2018/05/word-image-4001-1024x418.png 1024w" sizes="(max-width: 1095px) 100vw, 1095px" /></p>
<h2>1.3、RBAC具体要实现的功能</h2>
<p>
  1、用户的管理功能(后台用户的增删改查)
</p>
<p>
  2、角色的管理功能(增删改查)
</p>
<p>
  3、权限信息的增删改查操作
</p>
<p>
  4、给用户分配角色
</p>
<p>
  5、给角色分配权限信息
</p>
<p>
  6、针对后台中每一个方法进行判断是否拥有权限(根据当前用户访问的控制器方法跟当前用户归属的角色对应的权限信息进行比较)
</p>
<p>
  7、根据权限信息生成后台首页的导航菜单
</p>
<p>
  8、预留一个超级管理员用户
</p>
<p>
  9、预留一个超级管理员角色
</p>
<h1>2、创建数据表</h1>
<h2>2.1、创建角色表</h2>
<p>
  CREATE TABLE `shop_role` (
</p>
<p>
    `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
</p>
<p>
    `role_name` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;角色名称&#8217;,
</p>
<p>
    PRIMARY KEY (`id`)
</p>
<p>
  ) ENGINE=InnoDB DEFAULT CHARSET=utf8;
</p>
<h2>2.2、创建用户角色中间表</h2>
<p>
  CREATE TABLE `shop_admin_role` (
</p>
<p>
    `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
</p>
<p>
    `admin_id` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;后台用户id 关联admin表中的id字段&#8217;,
</p>
<p>
    `role_id` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;角色ID 关联角色表中的ID字段&#8217;,
</p>
<p>
    PRIMARY KEY (`id`)
</p>
<p>
  ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COMMENT=&#8217;用户角色中间表&#8217;;
</p>
<h2>2.3、创建权限表</h2>
<p>
  CREATE TABLE `shop_rule` (
</p>
<p>
    `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
</p>
<p>
    `rule_name` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;权限名称&#8217;,
</p>
<p>
    `module_name` varchar(255) NOT NULL DEFAULT &#8216;admin&#8217; COMMENT &#8216;模块名称&#8217;,
</p>
<p>
    `controller_name` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;控制器名称&#8217;,
</p>
<p>
    `action_name` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;操作名称&#8217;,
</p>
<p>
    `parent_id` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;上级权限id&#8217;,
</p>
<p>
    `is_show` tinyint(4) NOT NULL DEFAULT &#8216;1&#8217; COMMENT &#8216;是否导航菜单显示 1显示 0不显示&#8217;,
</p>
<p>
    PRIMARY KEY (`id`)
</p>
<p>
  ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COMMENT=&#8217;权限表&#8217;;
</p>
<h2>2.4、创建角色权限中间表</h2>
<p>
  CREATE TABLE `shop_role_rule` (
</p>
<p>
    `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
</p>
<p>
    `role_id` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;角色ID&#8217;,
</p>
<p>
    `rule_id` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;权限ID&#8217;,
</p>
<p>
    PRIMARY KEY (`id`)
</p>
<p>
  ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COMMENT=&#8217;角色权限中间表&#8217;;
</p>
<p><img loading="lazy" decoding="async" width="1052" height="516" src="/wp-content/uploads/2018/05/word-image-4002.png" class="wp-image-4472" srcset="/wp-content/uploads/2018/05/word-image-4002.png 1052w, /wp-content/uploads/2018/05/word-image-4002-300x147.png 300w, /wp-content/uploads/2018/05/word-image-4002-768x377.png 768w, /wp-content/uploads/2018/05/word-image-4002-1024x502.png 1024w" sizes="(max-width: 1052px) 100vw, 1052px" /></p>
<h1>3、角色管理功能</h1>
<h2>3.1、实现角色的添加</h2>
<p>
  ①创建控制器增加生成模型的方法
</p>
<p><img loading="lazy" decoding="async" width="862" height="532" src="/wp-content/uploads/2018/05/word-image-4003.png" class="wp-image-4473" srcset="/wp-content/uploads/2018/05/word-image-4003.png 862w, /wp-content/uploads/2018/05/word-image-4003-300x185.png 300w, /wp-content/uploads/2018/05/word-image-4003-768x474.png 768w" sizes="(max-width: 862px) 100vw, 862px" /></p>
<p>
  ②创建方法处理角色添加
</p>
<p><img loading="lazy" decoding="async" width="1024" height="599" src="/wp-content/uploads/2018/05/word-image-4004.png" class="wp-image-4474" srcset="/wp-content/uploads/2018/05/word-image-4004.png 1024w, /wp-content/uploads/2018/05/word-image-4004-300x175.png 300w, /wp-content/uploads/2018/05/word-image-4004-768x449.png 768w" sizes="(max-width: 1024px) 100vw, 1024px" /></p>
<p>
  ③创建自定义模型
</p>
<p><img loading="lazy" decoding="async" width="1078" height="635" src="/wp-content/uploads/2018/05/word-image-4005.png" class="wp-image-4475" srcset="/wp-content/uploads/2018/05/word-image-4005.png 1078w, /wp-content/uploads/2018/05/word-image-4005-300x177.png 300w, /wp-content/uploads/2018/05/word-image-4005-768x452.png 768w, /wp-content/uploads/2018/05/word-image-4005-1024x603.png 1024w" sizes="(max-width: 1078px) 100vw, 1078px" /></p>
<p>
  ④处理模板
</p>
<p><img loading="lazy" decoding="async" width="1081" height="697" src="/wp-content/uploads/2018/05/word-image-4006.png" class="wp-image-4476" srcset="/wp-content/uploads/2018/05/word-image-4006.png 1081w, /wp-content/uploads/2018/05/word-image-4006-300x193.png 300w, /wp-content/uploads/2018/05/word-image-4006-768x495.png 768w, /wp-content/uploads/2018/05/word-image-4006-1024x660.png 1024w" sizes="(max-width: 1081px) 100vw, 1081px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="934" height="248" src="/wp-content/uploads/2018/05/word-image-4007.png" class="wp-image-4477" srcset="/wp-content/uploads/2018/05/word-image-4007.png 934w, /wp-content/uploads/2018/05/word-image-4007-300x80.png 300w, /wp-content/uploads/2018/05/word-image-4007-768x204.png 768w" sizes="(max-width: 934px) 100vw, 934px" /><br />
<img loading="lazy" decoding="async" width="472" height="199" src="/wp-content/uploads/2018/05/word-image-4008.png" class="wp-image-4478" srcset="/wp-content/uploads/2018/05/word-image-4008.png 472w, /wp-content/uploads/2018/05/word-image-4008-300x126.png 300w" sizes="(max-width: 472px) 100vw, 472px" /></p>
<h2>3.2、列表显示</h2>
<p>
  ①创建方法
</p>
<p><img loading="lazy" decoding="async" width="883" height="396" src="/wp-content/uploads/2018/05/word-image-4009.png" class="wp-image-4479" srcset="/wp-content/uploads/2018/05/word-image-4009.png 883w, /wp-content/uploads/2018/05/word-image-4009-300x135.png 300w, /wp-content/uploads/2018/05/word-image-4009-768x344.png 768w" sizes="(max-width: 883px) 100vw, 883px" /></p>
<p>
  ②实现listData方法
</p>
<p><img loading="lazy" decoding="async" width="956" height="668" src="/wp-content/uploads/2018/05/word-image-4010.png" class="wp-image-4480" srcset="/wp-content/uploads/2018/05/word-image-4010.png 956w, /wp-content/uploads/2018/05/word-image-4010-300x210.png 300w, /wp-content/uploads/2018/05/word-image-4010-768x537.png 768w" sizes="(max-width: 956px) 100vw, 956px" /></p>
<p>
  ③处理模板
</p>
<p><img loading="lazy" decoding="async" width="1067" height="695" src="/wp-content/uploads/2018/05/word-image-4011.png" class="wp-image-4481" srcset="/wp-content/uploads/2018/05/word-image-4011.png 1067w, /wp-content/uploads/2018/05/word-image-4011-300x195.png 300w, /wp-content/uploads/2018/05/word-image-4011-768x500.png 768w, /wp-content/uploads/2018/05/word-image-4011-1024x667.png 1024w" sizes="(max-width: 1067px) 100vw, 1067px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="1247" height="327" src="/wp-content/uploads/2018/05/word-image-4012.png" class="wp-image-4482" srcset="/wp-content/uploads/2018/05/word-image-4012.png 1247w, /wp-content/uploads/2018/05/word-image-4012-300x79.png 300w, /wp-content/uploads/2018/05/word-image-4012-768x201.png 768w, /wp-content/uploads/2018/05/word-image-4012-1024x269.png 1024w" sizes="(max-width: 1247px) 100vw, 1247px" /></p>
<h2>3.3、角色删除</h2>
<p>
  ①修改角色列表中参数名称
</p>
<p><img loading="lazy" decoding="async" width="1058" height="446" src="/wp-content/uploads/2018/05/word-image-4013.png" class="wp-image-4483" srcset="/wp-content/uploads/2018/05/word-image-4013.png 1058w, /wp-content/uploads/2018/05/word-image-4013-300x126.png 300w, /wp-content/uploads/2018/05/word-image-4013-768x324.png 768w, /wp-content/uploads/2018/05/word-image-4013-1024x432.png 1024w" sizes="(max-width: 1058px) 100vw, 1058px" /></p>
<p>
  ②创建方法实现删除
</p>
<p><img loading="lazy" decoding="async" width="924" height="519" src="/wp-content/uploads/2018/05/word-image-4014.png" class="wp-image-4484" srcset="/wp-content/uploads/2018/05/word-image-4014.png 924w, /wp-content/uploads/2018/05/word-image-4014-300x169.png 300w, /wp-content/uploads/2018/05/word-image-4014-768x431.png 768w" sizes="(max-width: 924px) 100vw, 924px" /></p>
<p>
  ③修改模型增加dels方法
</p>
<p><img loading="lazy" decoding="async" width="939" height="389" src="/wp-content/uploads/2018/05/word-image-4015.png" class="wp-image-4485" srcset="/wp-content/uploads/2018/05/word-image-4015.png 939w, /wp-content/uploads/2018/05/word-image-4015-300x124.png 300w, /wp-content/uploads/2018/05/word-image-4015-768x318.png 768w" sizes="(max-width: 939px) 100vw, 939px" /></p>
<p>
  ④再次修改控制器方法对超级管理进行过滤
</p>
<p><img loading="lazy" decoding="async" width="885" height="582" src="/wp-content/uploads/2018/05/word-image-4016.png" class="wp-image-4486" srcset="/wp-content/uploads/2018/05/word-image-4016.png 885w, /wp-content/uploads/2018/05/word-image-4016-300x197.png 300w, /wp-content/uploads/2018/05/word-image-4016-768x505.png 768w" sizes="(max-width: 885px) 100vw, 885px" /></p>
<h2>3.4、编辑功能</h2>
<p>
  ①创建方法实现显示模板及数据提交
</p>
<p><img loading="lazy" decoding="async" width="1047" height="692" src="/wp-content/uploads/2018/05/word-image-4017.png" class="wp-image-4487" srcset="/wp-content/uploads/2018/05/word-image-4017.png 1047w, /wp-content/uploads/2018/05/word-image-4017-300x198.png 300w, /wp-content/uploads/2018/05/word-image-4017-768x508.png 768w, /wp-content/uploads/2018/05/word-image-4017-1024x677.png 1024w" sizes="(max-width: 1047px) 100vw, 1047px" /></p>
<p>
  ②创建模板
</p>
<p><img loading="lazy" decoding="async" width="1079" height="706" src="/wp-content/uploads/2018/05/word-image-4018.png" class="wp-image-4488" srcset="/wp-content/uploads/2018/05/word-image-4018.png 1079w, /wp-content/uploads/2018/05/word-image-4018-300x196.png 300w, /wp-content/uploads/2018/05/word-image-4018-768x503.png 768w, /wp-content/uploads/2018/05/word-image-4018-1024x670.png 1024w" sizes="(max-width: 1079px) 100vw, 1079px" /></p>
<p>
  效果
</p>
<p><img loading="lazy" decoding="async" width="938" height="243" src="/wp-content/uploads/2018/05/word-image-4019.png" class="wp-image-4489" srcset="/wp-content/uploads/2018/05/word-image-4019.png 938w, /wp-content/uploads/2018/05/word-image-4019-300x78.png 300w, /wp-content/uploads/2018/05/word-image-4019-768x199.png 768w" sizes="(max-width: 938px) 100vw, 938px" /></p>
<h1>用户管理功能</h1>
<h2>4.1、用户添加</h2>
<h3>4.1.1、实现添加的表单</h3>
<p>
  ①创建控制器方法显示模板
</p>
<p><img loading="lazy" decoding="async" width="879" height="584" src="/wp-content/uploads/2018/05/word-image-4020.png" class="wp-image-4490" srcset="/wp-content/uploads/2018/05/word-image-4020.png 879w, /wp-content/uploads/2018/05/word-image-4020-300x199.png 300w, /wp-content/uploads/2018/05/word-image-4020-768x510.png 768w" sizes="(max-width: 879px) 100vw, 879px" /></p>
<p>
  ②创建模板
</p>
<p><img loading="lazy" decoding="async" width="1054" height="687" src="/wp-content/uploads/2018/05/word-image-4021.png" class="wp-image-4491" srcset="/wp-content/uploads/2018/05/word-image-4021.png 1054w, /wp-content/uploads/2018/05/word-image-4021-300x196.png 300w, /wp-content/uploads/2018/05/word-image-4021-768x501.png 768w, /wp-content/uploads/2018/05/word-image-4021-1024x667.png 1024w" sizes="(max-width: 1054px) 100vw, 1054px" /></p>
<p>
  效果
</p>
<p><img loading="lazy" decoding="async" width="967" height="277" src="/wp-content/uploads/2018/05/word-image-4022.png" class="wp-image-4492" srcset="/wp-content/uploads/2018/05/word-image-4022.png 967w, /wp-content/uploads/2018/05/word-image-4022-300x86.png 300w, /wp-content/uploads/2018/05/word-image-4022-768x220.png 768w" sizes="(max-width: 967px) 100vw, 967px" /></p>
<h3>4.1.2、实现数据的添加入库</h3>
<p>
  ①修改add方法处理表单提交
</p>
<p><img loading="lazy" decoding="async" width="1073" height="678" src="/wp-content/uploads/2018/05/word-image-4023.png" class="wp-image-4493" srcset="/wp-content/uploads/2018/05/word-image-4023.png 1073w, /wp-content/uploads/2018/05/word-image-4023-300x190.png 300w, /wp-content/uploads/2018/05/word-image-4023-768x485.png 768w, /wp-content/uploads/2018/05/word-image-4023-1024x647.png 1024w" sizes="(max-width: 1073px) 100vw, 1073px" /></p>
<p>
  ②创建模型下insert方法
</p>
<p><img loading="lazy" decoding="async" width="1064" height="699" src="/wp-content/uploads/2018/05/word-image-4024.png" class="wp-image-4494" srcset="/wp-content/uploads/2018/05/word-image-4024.png 1064w, /wp-content/uploads/2018/05/word-image-4024-300x197.png 300w, /wp-content/uploads/2018/05/word-image-4024-768x505.png 768w, /wp-content/uploads/2018/05/word-image-4024-1024x673.png 1024w" sizes="(max-width: 1064px) 100vw, 1064px" /><br />
<img loading="lazy" decoding="async" width="1058" height="536" src="/wp-content/uploads/2018/05/word-image-4025.png" class="wp-image-4495" srcset="/wp-content/uploads/2018/05/word-image-4025.png 1058w, /wp-content/uploads/2018/05/word-image-4025-300x152.png 300w, /wp-content/uploads/2018/05/word-image-4025-768x389.png 768w, /wp-content/uploads/2018/05/word-image-4025-1024x519.png 1024w" sizes="(max-width: 1058px) 100vw, 1058px" /></p>
<p>
  结果如下
</p>
<p><img loading="lazy" decoding="async" width="695" height="300" src="/wp-content/uploads/2018/05/word-image-4026.png" class="wp-image-4496" srcset="/wp-content/uploads/2018/05/word-image-4026.png 695w, /wp-content/uploads/2018/05/word-image-4026-300x129.png 300w" sizes="(max-width: 695px) 100vw, 695px" /><br />
<img loading="lazy" decoding="async" width="892" height="271" src="/wp-content/uploads/2018/05/word-image-4027.png" class="wp-image-4497" srcset="/wp-content/uploads/2018/05/word-image-4027.png 892w, /wp-content/uploads/2018/05/word-image-4027-300x91.png 300w, /wp-content/uploads/2018/05/word-image-4027-768x233.png 768w" sizes="(max-width: 892px) 100vw, 892px" /></p>
<h2>4.2、实现用户的列表显示</h2>
<p>
  ①创建方法获取数据
</p>
<p><img loading="lazy" decoding="async" width="812" height="426" src="/wp-content/uploads/2018/05/word-image-4028.png" class="wp-image-4498" srcset="/wp-content/uploads/2018/05/word-image-4028.png 812w, /wp-content/uploads/2018/05/word-image-4028-300x157.png 300w, /wp-content/uploads/2018/05/word-image-4028-768x403.png 768w" sizes="(max-width: 812px) 100vw, 812px" /></p>
<p>
  ②实现模型下的listData方法
</p>
<p><img loading="lazy" decoding="async" width="1059" height="703" src="/wp-content/uploads/2018/05/word-image-4029.png" class="wp-image-4499" srcset="/wp-content/uploads/2018/05/word-image-4029.png 1059w, /wp-content/uploads/2018/05/word-image-4029-300x199.png 300w, /wp-content/uploads/2018/05/word-image-4029-768x510.png 768w, /wp-content/uploads/2018/05/word-image-4029-1024x680.png 1024w" sizes="(max-width: 1059px) 100vw, 1059px" /></p>
<p>
  ③处理模板
</p>
<p><img loading="lazy" decoding="async" width="1088" height="636" src="/wp-content/uploads/2018/05/word-image-4030.png" class="wp-image-4500" srcset="/wp-content/uploads/2018/05/word-image-4030.png 1088w, /wp-content/uploads/2018/05/word-image-4030-300x175.png 300w, /wp-content/uploads/2018/05/word-image-4030-768x449.png 768w, /wp-content/uploads/2018/05/word-image-4030-1024x599.png 1024w" sizes="(max-width: 1088px) 100vw, 1088px" /></p>
<p>
  效果
</p>
<p><img loading="lazy" decoding="async" width="1360" height="260" src="/wp-content/uploads/2018/05/word-image-4031.png" class="wp-image-4501" srcset="/wp-content/uploads/2018/05/word-image-4031.png 1360w, /wp-content/uploads/2018/05/word-image-4031-300x57.png 300w, /wp-content/uploads/2018/05/word-image-4031-768x147.png 768w, /wp-content/uploads/2018/05/word-image-4031-1024x196.png 1024w" sizes="(max-width: 1360px) 100vw, 1360px" /></p>
<h2>4.3、实现用户的删除功能</h2>
<p>
  ①创建方法
</p>
<p><img loading="lazy" decoding="async" width="874" height="391" src="/wp-content/uploads/2018/05/word-image-4032.png" class="wp-image-4502" srcset="/wp-content/uploads/2018/05/word-image-4032.png 874w, /wp-content/uploads/2018/05/word-image-4032-300x134.png 300w, /wp-content/uploads/2018/05/word-image-4032-768x344.png 768w" sizes="(max-width: 874px) 100vw, 874px" /></p>
<p>
  ②实现dels方法
</p>
<p><img loading="lazy" decoding="async" width="1052" height="444" src="/wp-content/uploads/2018/05/word-image-4033.png" class="wp-image-4503" srcset="/wp-content/uploads/2018/05/word-image-4033.png 1052w, /wp-content/uploads/2018/05/word-image-4033-300x127.png 300w, /wp-content/uploads/2018/05/word-image-4033-768x324.png 768w, /wp-content/uploads/2018/05/word-image-4033-1024x432.png 1024w" sizes="(max-width: 1052px) 100vw, 1052px" /></p>
<p>
  ④限制预留的超级管理不能删除
</p>
<p><img loading="lazy" decoding="async" width="969" height="469" src="/wp-content/uploads/2018/05/word-image-4034.png" class="wp-image-4504" srcset="/wp-content/uploads/2018/05/word-image-4034.png 969w, /wp-content/uploads/2018/05/word-image-4034-300x145.png 300w, /wp-content/uploads/2018/05/word-image-4034-768x372.png 768w" sizes="(max-width: 969px) 100vw, 969px" /></p>
<h2>4.4、用户编辑功能</h2>
<h3>4.4.1、显示原始信息</h3>
<p>
  ①创建方法获取用户的信息
</p>
<p><img loading="lazy" decoding="async" width="1114" height="670" src="/wp-content/uploads/2018/05/word-image-4035.png" class="wp-image-4505" srcset="/wp-content/uploads/2018/05/word-image-4035.png 1114w, /wp-content/uploads/2018/05/word-image-4035-300x180.png 300w, /wp-content/uploads/2018/05/word-image-4035-768x462.png 768w, /wp-content/uploads/2018/05/word-image-4035-1024x616.png 1024w" sizes="(max-width: 1114px) 100vw, 1114px" /></p>
<p>
  ②模型下实现方法
</p>
<p><img loading="lazy" decoding="async" width="1050" height="477" src="/wp-content/uploads/2018/05/word-image-4036.png" class="wp-image-4506" srcset="/wp-content/uploads/2018/05/word-image-4036.png 1050w, /wp-content/uploads/2018/05/word-image-4036-300x136.png 300w, /wp-content/uploads/2018/05/word-image-4036-768x349.png 768w, /wp-content/uploads/2018/05/word-image-4036-1024x465.png 1024w" sizes="(max-width: 1050px) 100vw, 1050px" /></p>
<p>
  调用此方法获取到的数据如下
</p>
<p><img loading="lazy" decoding="async" width="676" height="226" src="/wp-content/uploads/2018/05/word-image-4037.png" class="wp-image-4507" srcset="/wp-content/uploads/2018/05/word-image-4037.png 676w, /wp-content/uploads/2018/05/word-image-4037-300x100.png 300w" sizes="(max-width: 676px) 100vw, 676px" /></p>
<p>
  ③处理模板显示
</p>
<p><img loading="lazy" decoding="async" width="1070" height="706" src="/wp-content/uploads/2018/05/word-image-4038.png" class="wp-image-4508" srcset="/wp-content/uploads/2018/05/word-image-4038.png 1070w, /wp-content/uploads/2018/05/word-image-4038-300x198.png 300w, /wp-content/uploads/2018/05/word-image-4038-768x507.png 768w, /wp-content/uploads/2018/05/word-image-4038-1024x676.png 1024w" sizes="(max-width: 1070px) 100vw, 1070px" /></p>
<p>
  最终效果如下
</p>
<p><img loading="lazy" decoding="async" width="1049" height="412" src="/wp-content/uploads/2018/05/word-image-4039.png" class="wp-image-4509" srcset="/wp-content/uploads/2018/05/word-image-4039.png 1049w, /wp-content/uploads/2018/05/word-image-4039-300x118.png 300w, /wp-content/uploads/2018/05/word-image-4039-768x302.png 768w, /wp-content/uploads/2018/05/word-image-4039-1024x402.png 1024w" sizes="(max-width: 1049px) 100vw, 1049px" /></p>
<h3>4.4.2、实现用户信息修改入库</h3>
<p>
  ①修改方法代码
</p>
<p><img loading="lazy" decoding="async" width="1083" height="597" src="/wp-content/uploads/2018/05/word-image-4040.png" class="wp-image-4510" srcset="/wp-content/uploads/2018/05/word-image-4040.png 1083w, /wp-content/uploads/2018/05/word-image-4040-300x165.png 300w, /wp-content/uploads/2018/05/word-image-4040-768x423.png 768w, /wp-content/uploads/2018/05/word-image-4040-1024x564.png 1024w" sizes="(max-width: 1083px) 100vw, 1083px" /></p>
<p>
  ②实现update方法进修改
</p>
<p><img loading="lazy" decoding="async" width="1077" height="623" src="/wp-content/uploads/2018/05/word-image-4041.png" class="wp-image-4511" srcset="/wp-content/uploads/2018/05/word-image-4041.png 1077w, /wp-content/uploads/2018/05/word-image-4041-300x174.png 300w, /wp-content/uploads/2018/05/word-image-4041-768x444.png 768w, /wp-content/uploads/2018/05/word-image-4041-1024x592.png 1024w" sizes="(max-width: 1077px) 100vw, 1077px" /><br />
<img loading="lazy" decoding="async" width="1043" height="525" src="/wp-content/uploads/2018/05/word-image-4042.png" class="wp-image-4512" srcset="/wp-content/uploads/2018/05/word-image-4042.png 1043w, /wp-content/uploads/2018/05/word-image-4042-300x151.png 300w, /wp-content/uploads/2018/05/word-image-4042-768x387.png 768w, /wp-content/uploads/2018/05/word-image-4042-1024x515.png 1024w" sizes="(max-width: 1043px) 100vw, 1043px" /></p>
<p>
  具体效果数据变化即可
</p>
<p><img loading="lazy" decoding="async" width="631" height="140" src="/wp-content/uploads/2018/05/word-image-4043.png" class="wp-image-4513" srcset="/wp-content/uploads/2018/05/word-image-4043.png 631w, /wp-content/uploads/2018/05/word-image-4043-300x67.png 300w" sizes="(max-width: 631px) 100vw, 631px" /></p>
<h1>权限管理</h1>
<h2>5.1、权限添加</h2>
<h3>5.1.1、显示添加模板</h3>
<p>
  ①复制分类的控制器修改
</p>
<p><img loading="lazy" decoding="async" width="991" height="524" src="/wp-content/uploads/2018/05/word-image-4044.png" class="wp-image-4514" srcset="/wp-content/uploads/2018/05/word-image-4044.png 991w, /wp-content/uploads/2018/05/word-image-4044-300x159.png 300w, /wp-content/uploads/2018/05/word-image-4044-768x406.png 768w" sizes="(max-width: 991px) 100vw, 991px" /></p>
<p>
  ②复制分类的模型并且修改
</p>
<p><img loading="lazy" decoding="async" width="847" height="529" src="/wp-content/uploads/2018/05/word-image-4045.png" class="wp-image-4515" srcset="/wp-content/uploads/2018/05/word-image-4045.png 847w, /wp-content/uploads/2018/05/word-image-4045-300x187.png 300w, /wp-content/uploads/2018/05/word-image-4045-768x480.png 768w" sizes="(max-width: 847px) 100vw, 847px" /></p>
<p>
  ③复制视图
</p>
<p><img loading="lazy" decoding="async" width="1045" height="461" src="/wp-content/uploads/2018/05/word-image-4046.png" class="wp-image-4516" srcset="/wp-content/uploads/2018/05/word-image-4046.png 1045w, /wp-content/uploads/2018/05/word-image-4046-300x132.png 300w, /wp-content/uploads/2018/05/word-image-4046-768x339.png 768w, /wp-content/uploads/2018/05/word-image-4046-1024x452.png 1024w" sizes="(max-width: 1045px) 100vw, 1045px" /></p>
<p>
  ④修改添加控制器显示模板
</p>
<p><img loading="lazy" decoding="async" width="1072" height="486" src="/wp-content/uploads/2018/05/word-image-4047.png" class="wp-image-4517" srcset="/wp-content/uploads/2018/05/word-image-4047.png 1072w, /wp-content/uploads/2018/05/word-image-4047-300x136.png 300w, /wp-content/uploads/2018/05/word-image-4047-768x348.png 768w, /wp-content/uploads/2018/05/word-image-4047-1024x464.png 1024w" sizes="(max-width: 1072px) 100vw, 1072px" /></p>
<p>
  ⑤修改模型
</p>
<p><img loading="lazy" decoding="async" width="1035" height="669" src="/wp-content/uploads/2018/05/word-image-4048.png" class="wp-image-4518" srcset="/wp-content/uploads/2018/05/word-image-4048.png 1035w, /wp-content/uploads/2018/05/word-image-4048-300x194.png 300w, /wp-content/uploads/2018/05/word-image-4048-768x496.png 768w, /wp-content/uploads/2018/05/word-image-4048-1024x662.png 1024w" sizes="(max-width: 1035px) 100vw, 1035px" /></p>
<p>
  ⑥修改视图模板
</p>
<p><img loading="lazy" decoding="async" width="1040" height="675" src="/wp-content/uploads/2018/05/word-image-4049.png" class="wp-image-4519" srcset="/wp-content/uploads/2018/05/word-image-4049.png 1040w, /wp-content/uploads/2018/05/word-image-4049-300x195.png 300w, /wp-content/uploads/2018/05/word-image-4049-768x498.png 768w, /wp-content/uploads/2018/05/word-image-4049-1024x665.png 1024w" sizes="(max-width: 1040px) 100vw, 1040px" /></p>
<h3>5.1.2、实现添加数据提交</h3>
<p>
  ①修改添加处理表单提交
</p>
<p><img loading="lazy" decoding="async" width="897" height="659" src="/wp-content/uploads/2018/05/word-image-4050.png" class="wp-image-4520" srcset="/wp-content/uploads/2018/05/word-image-4050.png 897w, /wp-content/uploads/2018/05/word-image-4050-300x220.png 300w, /wp-content/uploads/2018/05/word-image-4050-768x564.png 768w" sizes="(max-width: 897px) 100vw, 897px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="824" height="347" src="/wp-content/uploads/2018/05/word-image-4051.png" class="wp-image-4521" srcset="/wp-content/uploads/2018/05/word-image-4051.png 824w, /wp-content/uploads/2018/05/word-image-4051-300x126.png 300w, /wp-content/uploads/2018/05/word-image-4051-768x323.png 768w" sizes="(max-width: 824px) 100vw, 824px" /><br />
<img loading="lazy" decoding="async" width="876" height="194" src="/wp-content/uploads/2018/05/word-image-4052.png" class="wp-image-4522" srcset="/wp-content/uploads/2018/05/word-image-4052.png 876w, /wp-content/uploads/2018/05/word-image-4052-300x66.png 300w, /wp-content/uploads/2018/05/word-image-4052-768x170.png 768w" sizes="(max-width: 876px) 100vw, 876px" /></p>
<h2>5.2、权限列表显示</h2>
<p>
  ①修改index方法
</p>
<p><img loading="lazy" decoding="async" width="851" height="417" src="/wp-content/uploads/2018/05/word-image-4053.png" class="wp-image-4523" srcset="/wp-content/uploads/2018/05/word-image-4053.png 851w, /wp-content/uploads/2018/05/word-image-4053-300x147.png 300w, /wp-content/uploads/2018/05/word-image-4053-768x376.png 768w" sizes="(max-width: 851px) 100vw, 851px" /></p>
<p>
  ②修改模板
</p>
<p><img loading="lazy" decoding="async" width="1056" height="648" src="/wp-content/uploads/2018/05/word-image-4054.png" class="wp-image-4524" srcset="/wp-content/uploads/2018/05/word-image-4054.png 1056w, /wp-content/uploads/2018/05/word-image-4054-300x184.png 300w, /wp-content/uploads/2018/05/word-image-4054-768x471.png 768w, /wp-content/uploads/2018/05/word-image-4054-1024x628.png 1024w" sizes="(max-width: 1056px) 100vw, 1056px" /></p>
<h2>5.3、权限删除功能</h2>
<p>
  ①修改dels方法
</p>
<p><img loading="lazy" decoding="async" width="946" height="590" src="/wp-content/uploads/2018/05/word-image-4055.png" class="wp-image-4525" srcset="/wp-content/uploads/2018/05/word-image-4055.png 946w, /wp-content/uploads/2018/05/word-image-4055-300x187.png 300w, /wp-content/uploads/2018/05/word-image-4055-768x479.png 768w" sizes="(max-width: 946px) 100vw, 946px" /></p>
<p>
  ②修改模型下的dels方法
</p>
<p><img loading="lazy" decoding="async" width="1046" height="525" src="/wp-content/uploads/2018/05/word-image-4056.png" class="wp-image-4526" srcset="/wp-content/uploads/2018/05/word-image-4056.png 1046w, /wp-content/uploads/2018/05/word-image-4056-300x151.png 300w, /wp-content/uploads/2018/05/word-image-4056-768x385.png 768w, /wp-content/uploads/2018/05/word-image-4056-1024x514.png 1024w" sizes="(max-width: 1046px) 100vw, 1046px" /></p>
<h2>5.4、权限的编辑</h2>
<p>
  ①修改edit方法显示原始信息
</p>
<p><img loading="lazy" decoding="async" width="1026" height="578" src="/wp-content/uploads/2018/05/word-image-4057.png" class="wp-image-4527" srcset="/wp-content/uploads/2018/05/word-image-4057.png 1026w, /wp-content/uploads/2018/05/word-image-4057-300x169.png 300w, /wp-content/uploads/2018/05/word-image-4057-768x433.png 768w, /wp-content/uploads/2018/05/word-image-4057-1024x577.png 1024w" sizes="(max-width: 1026px) 100vw, 1026px" /></p>
<p>
  ②修改模板
</p>
<p><img loading="lazy" decoding="async" width="1055" height="648" src="/wp-content/uploads/2018/05/word-image-4058.png" class="wp-image-4528" srcset="/wp-content/uploads/2018/05/word-image-4058.png 1055w, /wp-content/uploads/2018/05/word-image-4058-300x184.png 300w, /wp-content/uploads/2018/05/word-image-4058-768x472.png 768w, /wp-content/uploads/2018/05/word-image-4058-1024x629.png 1024w" sizes="(max-width: 1055px) 100vw, 1055px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="949" height="382" src="/wp-content/uploads/2018/05/word-image-4059.png" class="wp-image-4529" srcset="/wp-content/uploads/2018/05/word-image-4059.png 949w, /wp-content/uploads/2018/05/word-image-4059-300x121.png 300w, /wp-content/uploads/2018/05/word-image-4059-768x309.png 768w" sizes="(max-width: 949px) 100vw, 949px" /></p>
<p>
  ③修改edit方法处理表单提交
</p>
<p><img loading="lazy" decoding="async" width="999" height="660" src="/wp-content/uploads/2018/05/word-image-4060.png" class="wp-image-4530" srcset="/wp-content/uploads/2018/05/word-image-4060.png 999w, /wp-content/uploads/2018/05/word-image-4060-300x198.png 300w, /wp-content/uploads/2018/05/word-image-4060-768x507.png 768w" sizes="(max-width: 999px) 100vw, 999px" /></p>
<p>
  ④修改模型下的update方法
</p>
<p><img loading="lazy" decoding="async" width="1033" height="688" src="/wp-content/uploads/2018/05/word-image-4061.png" class="wp-image-4531" srcset="/wp-content/uploads/2018/05/word-image-4061.png 1033w, /wp-content/uploads/2018/05/word-image-4061-300x200.png 300w, /wp-content/uploads/2018/05/word-image-4061-768x512.png 768w, /wp-content/uploads/2018/05/word-image-4061-1024x682.png 1024w" sizes="(max-width: 1033px) 100vw, 1033px" /></p>
<p>
  ⑤修改getTree方法
</p>
<p><img loading="lazy" decoding="async" width="1060" height="713" src="/wp-content/uploads/2018/05/word-image-4062.png" class="wp-image-4532" srcset="/wp-content/uploads/2018/05/word-image-4062.png 1060w, /wp-content/uploads/2018/05/word-image-4062-300x202.png 300w, /wp-content/uploads/2018/05/word-image-4062-768x517.png 768w, /wp-content/uploads/2018/05/word-image-4062-1024x689.png 1024w" sizes="(max-width: 1060px) 100vw, 1060px" /></p>
<h1>为角色赋予权限</h1>
<h2>6.1、显示权限信息</h2>
<p>
  ①修改角色列表增加权限分配的入口
</p>
<p><img loading="lazy" decoding="async" width="1083" height="546" src="/wp-content/uploads/2018/05/word-image-4063.png" class="wp-image-4533" srcset="/wp-content/uploads/2018/05/word-image-4063.png 1083w, /wp-content/uploads/2018/05/word-image-4063-300x151.png 300w, /wp-content/uploads/2018/05/word-image-4063-768x387.png 768w, /wp-content/uploads/2018/05/word-image-4063-1024x516.png 1024w" sizes="(max-width: 1083px) 100vw, 1083px" /><br />
<img loading="lazy" decoding="async" width="1322" height="329" src="/wp-content/uploads/2018/05/word-image-4064.png" class="wp-image-4534" srcset="/wp-content/uploads/2018/05/word-image-4064.png 1322w, /wp-content/uploads/2018/05/word-image-4064-300x75.png 300w, /wp-content/uploads/2018/05/word-image-4064-768x191.png 768w, /wp-content/uploads/2018/05/word-image-4064-1024x255.png 1024w" sizes="(max-width: 1322px) 100vw, 1322px" /></p>
<p>
  ②创建方法获取所有的权限信息
</p>
<p><img loading="lazy" decoding="async" width="983" height="649" src="/wp-content/uploads/2018/05/word-image-4065.png" class="wp-image-4535" srcset="/wp-content/uploads/2018/05/word-image-4065.png 983w, /wp-content/uploads/2018/05/word-image-4065-300x198.png 300w, /wp-content/uploads/2018/05/word-image-4065-768x507.png 768w" sizes="(max-width: 983px) 100vw, 983px" /></p>
<p>
  ③拷贝模板
</p>
<p><img loading="lazy" decoding="async" width="1188" height="452" src="/wp-content/uploads/2018/05/word-image-4066.png" class="wp-image-4536" srcset="/wp-content/uploads/2018/05/word-image-4066.png 1188w, /wp-content/uploads/2018/05/word-image-4066-300x114.png 300w, /wp-content/uploads/2018/05/word-image-4066-768x292.png 768w, /wp-content/uploads/2018/05/word-image-4066-1024x390.png 1024w" sizes="(max-width: 1188px) 100vw, 1188px" /></p>
<p>
  ④修改模板显示数据
</p>
<p><img loading="lazy" decoding="async" width="1068" height="676" src="/wp-content/uploads/2018/05/word-image-4067.png" class="wp-image-4537" srcset="/wp-content/uploads/2018/05/word-image-4067.png 1068w, /wp-content/uploads/2018/05/word-image-4067-300x190.png 300w, /wp-content/uploads/2018/05/word-image-4067-768x486.png 768w, /wp-content/uploads/2018/05/word-image-4067-1024x648.png 1024w" sizes="(max-width: 1068px) 100vw, 1068px" /><br />
<img loading="lazy" decoding="async" width="1060" height="578" src="/wp-content/uploads/2018/05/word-image-4068.png" class="wp-image-4538" srcset="/wp-content/uploads/2018/05/word-image-4068.png 1060w, /wp-content/uploads/2018/05/word-image-4068-300x164.png 300w, /wp-content/uploads/2018/05/word-image-4068-768x419.png 768w, /wp-content/uploads/2018/05/word-image-4068-1024x558.png 1024w" sizes="(max-width: 1060px) 100vw, 1060px" /><br />
<img loading="lazy" decoding="async" width="1060" height="418" src="/wp-content/uploads/2018/05/word-image-4069.png" class="wp-image-4539" srcset="/wp-content/uploads/2018/05/word-image-4069.png 1060w, /wp-content/uploads/2018/05/word-image-4069-300x118.png 300w, /wp-content/uploads/2018/05/word-image-4069-768x303.png 768w, /wp-content/uploads/2018/05/word-image-4069-1024x404.png 1024w" sizes="(max-width: 1060px) 100vw, 1060px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="1000" height="271" src="/wp-content/uploads/2018/05/word-image-4070.png" class="wp-image-4540" srcset="/wp-content/uploads/2018/05/word-image-4070.png 1000w, /wp-content/uploads/2018/05/word-image-4070-300x81.png 300w, /wp-content/uploads/2018/05/word-image-4070-768x208.png 768w" sizes="(max-width: 1000px) 100vw, 1000px" /></p>
<h2>6.2、实现权限信息的入库</h2>
<p>
  ①修改控制器方法处理表单提交
</p>
<p><img loading="lazy" decoding="async" width="985" height="657" src="/wp-content/uploads/2018/05/word-image-4071.png" class="wp-image-4541" srcset="/wp-content/uploads/2018/05/word-image-4071.png 985w, /wp-content/uploads/2018/05/word-image-4071-300x200.png 300w, /wp-content/uploads/2018/05/word-image-4071-768x512.png 768w" sizes="(max-width: 985px) 100vw, 985px" /></p>
<p>
  ②创建模型方法
</p>
<p><img loading="lazy" decoding="async" width="1034" height="684" src="/wp-content/uploads/2018/05/word-image-4072.png" class="wp-image-4542" srcset="/wp-content/uploads/2018/05/word-image-4072.png 1034w, /wp-content/uploads/2018/05/word-image-4072-300x198.png 300w, /wp-content/uploads/2018/05/word-image-4072-768x508.png 768w, /wp-content/uploads/2018/05/word-image-4072-1024x677.png 1024w" sizes="(max-width: 1034px) 100vw, 1034px" /></p>
<p>
  最终效果
</p>
<p><img loading="lazy" decoding="async" width="435" height="203" src="/wp-content/uploads/2018/05/word-image-4073.png" class="wp-image-4543" srcset="/wp-content/uploads/2018/05/word-image-4073.png 435w, /wp-content/uploads/2018/05/word-image-4073-300x140.png 300w" sizes="(max-width: 435px) 100vw, 435px" /></p>
<h2>6.3、实现显示权限时勾选状态</h2>
<p>
  当进行分配权限时，显示所有权限信息，如果当前角色已经拥有此权限应该处于勾选状态
</p>
<p>
  ①修改分配权限显示
</p>
<p><img loading="lazy" decoding="async" width="1069" height="535" src="/wp-content/uploads/2018/05/word-image-4074.png" class="wp-image-4544" srcset="/wp-content/uploads/2018/05/word-image-4074.png 1069w, /wp-content/uploads/2018/05/word-image-4074-300x150.png 300w, /wp-content/uploads/2018/05/word-image-4074-768x384.png 768w, /wp-content/uploads/2018/05/word-image-4074-1024x512.png 1024w" sizes="(max-width: 1069px) 100vw, 1069px" /></p>
<p>
  ②增加模型方法
</p>
<p><img loading="lazy" decoding="async" width="999" height="321" src="/wp-content/uploads/2018/05/word-image-4075.png" class="wp-image-4545" srcset="/wp-content/uploads/2018/05/word-image-4075.png 999w, /wp-content/uploads/2018/05/word-image-4075-300x96.png 300w, /wp-content/uploads/2018/05/word-image-4075-768x247.png 768w" sizes="(max-width: 999px) 100vw, 999px" /></p>
<p>
  得到的结果
</p>
<p><img loading="lazy" decoding="async" width="862" height="308" src="/wp-content/uploads/2018/05/word-image-4076.png" class="wp-image-4546" srcset="/wp-content/uploads/2018/05/word-image-4076.png 862w, /wp-content/uploads/2018/05/word-image-4076-300x107.png 300w, /wp-content/uploads/2018/05/word-image-4076-768x274.png 768w" sizes="(max-width: 862px) 100vw, 862px" /></p>
<p>
  ③再次修改模板对数据进行格式化
</p>
<p><img loading="lazy" decoding="async" width="1100" height="611" src="/wp-content/uploads/2018/05/word-image-4077.png" class="wp-image-4547" srcset="/wp-content/uploads/2018/05/word-image-4077.png 1100w, /wp-content/uploads/2018/05/word-image-4077-300x167.png 300w, /wp-content/uploads/2018/05/word-image-4077-768x427.png 768w, /wp-content/uploads/2018/05/word-image-4077-1024x569.png 1024w" sizes="(max-width: 1100px) 100vw, 1100px" /><br />
<img loading="lazy" decoding="async" width="694" height="211" src="/wp-content/uploads/2018/05/word-image-4078.png" class="wp-image-4548" srcset="/wp-content/uploads/2018/05/word-image-4078.png 694w, /wp-content/uploads/2018/05/word-image-4078-300x91.png 300w" sizes="(max-width: 694px) 100vw, 694px" /></p>
<p>
  ④修改模板
</p>
<p><img loading="lazy" decoding="async" width="1092" height="680" src="/wp-content/uploads/2018/05/word-image-4079.png" class="wp-image-4549" srcset="/wp-content/uploads/2018/05/word-image-4079.png 1092w, /wp-content/uploads/2018/05/word-image-4079-300x187.png 300w, /wp-content/uploads/2018/05/word-image-4079-768x478.png 768w, /wp-content/uploads/2018/05/word-image-4079-1024x638.png 1024w" sizes="(max-width: 1092px) 100vw, 1092px" /><br />
<img loading="lazy" decoding="async" width="928" height="279" src="/wp-content/uploads/2018/05/word-image-4080.png" class="wp-image-4550" srcset="/wp-content/uploads/2018/05/word-image-4080.png 928w, /wp-content/uploads/2018/05/word-image-4080-300x90.png 300w, /wp-content/uploads/2018/05/word-image-4080-768x231.png 768w" sizes="(max-width: 928px) 100vw, 928px" /></p>
<h1>分析权限认证的实现</h1>
<ol>
<li>
  当用户登录完成之后可以获取到用户信息
</li>
<li>
  根据用户ID获取对应的角色ID
</li>
<li>
  当角色ID为1表示为超级管理员角色 设置不进行任何权限认证，也需要获取所有的权限信息(由于导航菜单的显示)。当角色ID为其他时。先根据角色ID到角色权限中间表中找到角色对应的权限ID,在根据权限ID获取到详细权限信息
</li>
<li>
  根据当前用户请求的模块名、控制器名、方法名称与第3步获取到的权限结果集进行比较。为了比较方便 在第3步对获取到的权限信息格式化成为一个一维数组。然后在进行判断 是否在数组即可
</li>
<li>
  实现显示导航菜单。根据已有的权限信息将is_show为1的放入到一个数组中。模板中显示即可
</li>
</ol>
]]></content:encoded>
					
					<wfw:commentRss>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4470.html/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>TP3.2商城 （五）权限认证、商品相册、商品分类、首页推荐</title>
		<link>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4389.html</link>
					<comments>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4389.html#respond</comments>
		
		<dc:creator><![CDATA[Mr.Lee]]></dc:creator>
		<pubDate>Sat, 19 May 2018 12:42:17 +0000</pubDate>
				<category><![CDATA[TP3.2]]></category>
		<category><![CDATA[TP3.2商城]]></category>
		<category><![CDATA[后台框架]]></category>
		<category><![CDATA[商品分类]]></category>
		<category><![CDATA[商品相册]]></category>
		<category><![CDATA[权限认证]]></category>
		<category><![CDATA[首页推荐]]></category>
		<guid isPermaLink="false">/?p=4389</guid>

					<description><![CDATA[权限认证 实现权限认证 ①修改公共控制器调用方法进行校验 ②增加属性保存信息 ③根据用户ID获取角色ID ④根 [&#8230;]]]></description>
										<content:encoded><![CDATA[<h1>权限认证</h1>
<h2>实现权限认证</h2>
<p>
  ①修改公共控制器调用方法进行校验
</p>
<p><img loading="lazy" decoding="async" width="1013" height="694" src="/wp-content/uploads/2018/05/word-image-3923.png" class="wp-image-4390" srcset="/wp-content/uploads/2018/05/word-image-3923.png 1013w, /wp-content/uploads/2018/05/word-image-3923-300x206.png 300w, /wp-content/uploads/2018/05/word-image-3923-768x526.png 768w, /wp-content/uploads/2018/05/word-image-3923-220x150.png 220w" sizes="(max-width: 1013px) 100vw, 1013px" /></p>
<p>
  ②增加属性保存信息
</p>
<p><img loading="lazy" decoding="async" width="1002" height="489" src="/wp-content/uploads/2018/05/word-image-3924.png" class="wp-image-4391" srcset="/wp-content/uploads/2018/05/word-image-3924.png 1002w, /wp-content/uploads/2018/05/word-image-3924-300x146.png 300w, /wp-content/uploads/2018/05/word-image-3924-768x375.png 768w" sizes="(max-width: 1002px) 100vw, 1002px" /></p>
<p>
  ③根据用户ID获取角色ID
</p>
<p><img loading="lazy" decoding="async" width="1073" height="515" src="/wp-content/uploads/2018/05/word-image-3925.png" class="wp-image-4392" srcset="/wp-content/uploads/2018/05/word-image-3925.png 1073w, /wp-content/uploads/2018/05/word-image-3925-300x144.png 300w, /wp-content/uploads/2018/05/word-image-3925-768x369.png 768w, /wp-content/uploads/2018/05/word-image-3925-1024x491.png 1024w" sizes="(max-width: 1073px) 100vw, 1073px" /></p>
<p>
  ④根据不同的角色获取权限信息
</p>
<p><img loading="lazy" decoding="async" width="1066" height="674" src="/wp-content/uploads/2018/05/word-image-3926.png" class="wp-image-4393" srcset="/wp-content/uploads/2018/05/word-image-3926.png 1066w, /wp-content/uploads/2018/05/word-image-3926-300x190.png 300w, /wp-content/uploads/2018/05/word-image-3926-768x486.png 768w, /wp-content/uploads/2018/05/word-image-3926-1024x647.png 1024w" sizes="(max-width: 1066px) 100vw, 1066px" /></p>
<p>
  对于非超级管理员角色的权限信息如下
</p>
<p><img loading="lazy" decoding="async" width="795" height="488" src="/wp-content/uploads/2018/05/word-image-3927.png" class="wp-image-4394" srcset="/wp-content/uploads/2018/05/word-image-3927.png 795w, /wp-content/uploads/2018/05/word-image-3927-300x184.png 300w, /wp-content/uploads/2018/05/word-image-3927-768x471.png 768w" sizes="(max-width: 795px) 100vw, 795px" /></p>
<p>
  ⑤对权限信息进行格式化
</p>
<p><img loading="lazy" decoding="async" width="1094" height="658" src="/wp-content/uploads/2018/05/word-image-3928.png" class="wp-image-4395" srcset="/wp-content/uploads/2018/05/word-image-3928.png 1094w, /wp-content/uploads/2018/05/word-image-3928-300x180.png 300w, /wp-content/uploads/2018/05/word-image-3928-768x462.png 768w, /wp-content/uploads/2018/05/word-image-3928-1024x616.png 1024w" sizes="(max-width: 1094px) 100vw, 1094px" /></p>
<p>
  超级管理数据
</p>
<p><img loading="lazy" decoding="async" width="820" height="642" src="/wp-content/uploads/2018/05/word-image-3929.png" class="wp-image-4396" srcset="/wp-content/uploads/2018/05/word-image-3929.png 820w, /wp-content/uploads/2018/05/word-image-3929-300x235.png 300w, /wp-content/uploads/2018/05/word-image-3929-768x601.png 768w" sizes="(max-width: 820px) 100vw, 820px" /></p>
<p>
  非超级管理员
</p>
<p><img loading="lazy" decoding="async" width="921" height="537" src="/wp-content/uploads/2018/05/word-image-3930.png" class="wp-image-4397" srcset="/wp-content/uploads/2018/05/word-image-3930.png 921w, /wp-content/uploads/2018/05/word-image-3930-300x175.png 300w, /wp-content/uploads/2018/05/word-image-3930-768x448.png 768w" sizes="(max-width: 921px) 100vw, 921px" /></p>
<p>
  ⑥根据当前访问的进行判断
</p>
<p><img loading="lazy" decoding="async" width="1104" height="716" src="/wp-content/uploads/2018/05/word-image-3931.png" class="wp-image-4398" srcset="/wp-content/uploads/2018/05/word-image-3931.png 1104w, /wp-content/uploads/2018/05/word-image-3931-300x195.png 300w, /wp-content/uploads/2018/05/word-image-3931-768x498.png 768w, /wp-content/uploads/2018/05/word-image-3931-1024x664.png 1024w" sizes="(max-width: 1104px) 100vw, 1104px" /></p>
<h2>处理后台首页没有权限</h2>
<p><img loading="lazy" decoding="async" width="1023" height="685" src="/wp-content/uploads/2018/05/word-image-3932.png" class="wp-image-4399" srcset="/wp-content/uploads/2018/05/word-image-3932.png 1023w, /wp-content/uploads/2018/05/word-image-3932-300x201.png 300w, /wp-content/uploads/2018/05/word-image-3932-768x514.png 768w" sizes="(max-width: 1023px) 100vw, 1023px" /></p>
<h2>处理后台首页中的导航菜单</h2>
<p>
  ①修改后台首页控制器增加方法
</p>
<p><img loading="lazy" decoding="async" width="955" height="629" src="/wp-content/uploads/2018/05/word-image-3933.png" class="wp-image-4400" srcset="/wp-content/uploads/2018/05/word-image-3933.png 955w, /wp-content/uploads/2018/05/word-image-3933-300x198.png 300w, /wp-content/uploads/2018/05/word-image-3933-768x506.png 768w" sizes="(max-width: 955px) 100vw, 955px" /></p>
<p>
  ②模板显示
</p>
<p><img loading="lazy" decoding="async" width="1071" height="702" src="/wp-content/uploads/2018/05/word-image-3934.png" class="wp-image-4401" srcset="/wp-content/uploads/2018/05/word-image-3934.png 1071w, /wp-content/uploads/2018/05/word-image-3934-300x197.png 300w, /wp-content/uploads/2018/05/word-image-3934-768x503.png 768w, /wp-content/uploads/2018/05/word-image-3934-1024x671.png 1024w" sizes="(max-width: 1071px) 100vw, 1071px" /></p>
<p>
  非超级管理员
</p>
<p><img loading="lazy" decoding="async" width="729" height="359" src="/wp-content/uploads/2018/05/word-image-3935.png" class="wp-image-4402" srcset="/wp-content/uploads/2018/05/word-image-3935.png 729w, /wp-content/uploads/2018/05/word-image-3935-300x148.png 300w" sizes="(max-width: 729px) 100vw, 729px" /></p>
<p>
  超级管理员
</p>
<p><img loading="lazy" decoding="async" width="891" height="366" src="/wp-content/uploads/2018/05/word-image-3936.png" class="wp-image-4403" srcset="/wp-content/uploads/2018/05/word-image-3936.png 891w, /wp-content/uploads/2018/05/word-image-3936-300x123.png 300w, /wp-content/uploads/2018/05/word-image-3936-768x315.png 768w" sizes="(max-width: 891px) 100vw, 891px" /></p>
<h2>权限认证性能调优</h2>
<p>
  由于权限认证处理是在公共控制器中的构造方法中实现。对于每一次访问方法都需要走权限认证。而权限认证涉及多次的数据库的查询操作。因此影响数据库性能。可以使用缓存解决问题
</p>
<p>
  ①修改代码
</p>
<p><img loading="lazy" decoding="async" width="1081" height="688" src="/wp-content/uploads/2018/05/word-image-3937.png" class="wp-image-4404" srcset="/wp-content/uploads/2018/05/word-image-3937.png 1081w, /wp-content/uploads/2018/05/word-image-3937-300x191.png 300w, /wp-content/uploads/2018/05/word-image-3937-768x489.png 768w, /wp-content/uploads/2018/05/word-image-3937-1024x652.png 1024w" sizes="(max-width: 1081px) 100vw, 1081px" /><br />
<img loading="lazy" decoding="async" width="1046" height="587" src="/wp-content/uploads/2018/05/word-image-3938.png" class="wp-image-4405" srcset="/wp-content/uploads/2018/05/word-image-3938.png 1046w, /wp-content/uploads/2018/05/word-image-3938-300x168.png 300w, /wp-content/uploads/2018/05/word-image-3938-768x431.png 768w, /wp-content/uploads/2018/05/word-image-3938-1024x575.png 1024w" sizes="(max-width: 1046px) 100vw, 1046px" /></p>
<p>
  ②处理超级管理员的权限
</p>
<p>
  当超级管理员访问某一个方法 而方法在权限中没有对应的数据
</p>
<p><img loading="lazy" decoding="async" width="834" height="361" src="/wp-content/uploads/2018/05/word-image-3939.png" class="wp-image-4406" srcset="/wp-content/uploads/2018/05/word-image-3939.png 834w, /wp-content/uploads/2018/05/word-image-3939-300x130.png 300w, /wp-content/uploads/2018/05/word-image-3939-768x332.png 768w" sizes="(max-width: 834px) 100vw, 834px" /><br />
<img loading="lazy" decoding="async" width="986" height="412" src="/wp-content/uploads/2018/05/word-image-3940.png" class="wp-image-4407" srcset="/wp-content/uploads/2018/05/word-image-3940.png 986w, /wp-content/uploads/2018/05/word-image-3940-300x125.png 300w, /wp-content/uploads/2018/05/word-image-3940-768x321.png 768w" sizes="(max-width: 986px) 100vw, 986px" /></p>
<p>
  使用缓存需要注意：一旦权限信息或者用户信息发送变更需要更新缓存
</p>
<h1>商品相册</h1>
<h2>添加商品相册</h2>
<h3>创建相册数据表</h3>
<p>
  CREATE TABLE `shop_goods_img` (
</p>
<p>
    `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
</p>
<p>
    `goods_id` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;商品ID&#8217;,
</p>
<p>
    `goods_img` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;相册原图&#8217;,
</p>
<p>
    `goods_thumb` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;相册小图&#8217;,
</p>
<p>
    PRIMARY KEY (`id`)
</p>
<p>
  ) ENGINE=InnoDB DEFAULT CHARSET=utf8;
</p>
<h3>商品添加显示相册</h3>
<p>
  ①增加相册选项卡
</p>
<p><img loading="lazy" decoding="async" width="1002" height="308" src="/wp-content/uploads/2018/05/word-image-3941.png" class="wp-image-4408" srcset="/wp-content/uploads/2018/05/word-image-3941.png 1002w, /wp-content/uploads/2018/05/word-image-3941-300x92.png 300w, /wp-content/uploads/2018/05/word-image-3941-768x236.png 768w" sizes="(max-width: 1002px) 100vw, 1002px" /></p>
<p>
  ②增加选项卡标签对应的table
</p>
<p><img loading="lazy" decoding="async" width="1065" height="648" src="/wp-content/uploads/2018/05/word-image-3942.png" class="wp-image-4409" srcset="/wp-content/uploads/2018/05/word-image-3942.png 1065w, /wp-content/uploads/2018/05/word-image-3942-300x183.png 300w, /wp-content/uploads/2018/05/word-image-3942-768x467.png 768w, /wp-content/uploads/2018/05/word-image-3942-1024x623.png 1024w" sizes="(max-width: 1065px) 100vw, 1065px" /></p>
<p>
  效果如下
</p>
<p><img loading="lazy" decoding="async" width="1051" height="289" src="/wp-content/uploads/2018/05/word-image-3943.png" class="wp-image-4410" srcset="/wp-content/uploads/2018/05/word-image-3943.png 1051w, /wp-content/uploads/2018/05/word-image-3943-300x82.png 300w, /wp-content/uploads/2018/05/word-image-3943-768x211.png 768w, /wp-content/uploads/2018/05/word-image-3943-1024x282.png 1024w" sizes="(max-width: 1051px) 100vw, 1051px" /></p>
<p>
  ③实现点击按钮增肌上传框
</p>
<p><img loading="lazy" decoding="async" width="1028" height="480" src="/wp-content/uploads/2018/05/word-image-3944.png" class="wp-image-4411" srcset="/wp-content/uploads/2018/05/word-image-3944.png 1028w, /wp-content/uploads/2018/05/word-image-3944-300x140.png 300w, /wp-content/uploads/2018/05/word-image-3944-768x359.png 768w, /wp-content/uploads/2018/05/word-image-3944-1024x478.png 1024w" sizes="(max-width: 1028px) 100vw, 1028px" /></p>
<h3>实现相册入库</h3>
<p><img loading="lazy" decoding="async" width="1039" height="696" src="/wp-content/uploads/2018/05/word-image-3945.png" class="wp-image-4412" srcset="/wp-content/uploads/2018/05/word-image-3945.png 1039w, /wp-content/uploads/2018/05/word-image-3945-300x201.png 300w, /wp-content/uploads/2018/05/word-image-3945-768x514.png 768w, /wp-content/uploads/2018/05/word-image-3945-1024x686.png 1024w" sizes="(max-width: 1039px) 100vw, 1039px" /></p>
<p>
  测试相册入库直接写入商品信息
</p>
<p><img loading="lazy" decoding="async" width="933" height="362" src="/wp-content/uploads/2018/05/word-image-3946.png" class="wp-image-4413" srcset="/wp-content/uploads/2018/05/word-image-3946.png 933w, /wp-content/uploads/2018/05/word-image-3946-300x116.png 300w, /wp-content/uploads/2018/05/word-image-3946-768x298.png 768w" sizes="(max-width: 933px) 100vw, 933px" /></p>
<h2>相册编辑</h2>
<h3>显示编辑商品的相册</h3>
<p>
  ①修改方法
</p>
<p><img loading="lazy" decoding="async" width="1063" height="648" src="/wp-content/uploads/2018/05/word-image-3947.png" class="wp-image-4414" srcset="/wp-content/uploads/2018/05/word-image-3947.png 1063w, /wp-content/uploads/2018/05/word-image-3947-300x183.png 300w, /wp-content/uploads/2018/05/word-image-3947-768x468.png 768w, /wp-content/uploads/2018/05/word-image-3947-1024x624.png 1024w" sizes="(max-width: 1063px) 100vw, 1063px" /></p>
<p>
  ②显示edit模板增加相册选项卡
</p>
<p>
  增加选项卡
</p>
<p><img loading="lazy" decoding="async" width="1080" height="400" src="/wp-content/uploads/2018/05/word-image-3948.png" class="wp-image-4415" srcset="/wp-content/uploads/2018/05/word-image-3948.png 1080w, /wp-content/uploads/2018/05/word-image-3948-300x111.png 300w, /wp-content/uploads/2018/05/word-image-3948-768x284.png 768w, /wp-content/uploads/2018/05/word-image-3948-1024x379.png 1024w" sizes="(max-width: 1080px) 100vw, 1080px" /><br />
<img loading="lazy" decoding="async" width="1044" height="699" src="/wp-content/uploads/2018/05/word-image-3949.png" class="wp-image-4416" srcset="/wp-content/uploads/2018/05/word-image-3949.png 1044w, /wp-content/uploads/2018/05/word-image-3949-300x201.png 300w, /wp-content/uploads/2018/05/word-image-3949-768x514.png 768w, /wp-content/uploads/2018/05/word-image-3949-1024x686.png 1024w" sizes="(max-width: 1044px) 100vw, 1044px" /></p>
<p>
  拷贝js
</p>
<p><img loading="lazy" decoding="async" width="1038" height="507" src="/wp-content/uploads/2018/05/word-image-3950.png" class="wp-image-4417" srcset="/wp-content/uploads/2018/05/word-image-3950.png 1038w, /wp-content/uploads/2018/05/word-image-3950-300x147.png 300w, /wp-content/uploads/2018/05/word-image-3950-768x375.png 768w, /wp-content/uploads/2018/05/word-image-3950-1024x500.png 1024w" sizes="(max-width: 1038px) 100vw, 1038px" /></p>
<p>
  最终效果如下
</p>
<p><img loading="lazy" decoding="async" width="1041" height="583" src="/wp-content/uploads/2018/05/word-image-3951.png" class="wp-image-4418" srcset="/wp-content/uploads/2018/05/word-image-3951.png 1041w, /wp-content/uploads/2018/05/word-image-3951-300x168.png 300w, /wp-content/uploads/2018/05/word-image-3951-768x430.png 768w, /wp-content/uploads/2018/05/word-image-3951-1024x573.png 1024w" sizes="(max-width: 1041px) 100vw, 1041px" /></p>
<h3>实现编辑商品追加相册</h3>
<p><img loading="lazy" decoding="async" width="1049" height="701" src="/wp-content/uploads/2018/05/word-image-3952.png" class="wp-image-4419" srcset="/wp-content/uploads/2018/05/word-image-3952.png 1049w, /wp-content/uploads/2018/05/word-image-3952-300x200.png 300w, /wp-content/uploads/2018/05/word-image-3952-768x513.png 768w, /wp-content/uploads/2018/05/word-image-3952-1024x684.png 1024w" sizes="(max-width: 1049px) 100vw, 1049px" /><br />
<img loading="lazy" decoding="async" width="960" height="376" src="/wp-content/uploads/2018/05/word-image-3953.png" class="wp-image-4420" srcset="/wp-content/uploads/2018/05/word-image-3953.png 960w, /wp-content/uploads/2018/05/word-image-3953-300x118.png 300w, /wp-content/uploads/2018/05/word-image-3953-768x301.png 768w" sizes="(max-width: 960px) 100vw, 960px" /></p>
<h3>实现编辑商品相册图片删除</h3>
<p>
  ①修改图片属性
</p>
<p><img loading="lazy" decoding="async" width="1037" height="559" src="/wp-content/uploads/2018/05/word-image-3954.png" class="wp-image-4421" srcset="/wp-content/uploads/2018/05/word-image-3954.png 1037w, /wp-content/uploads/2018/05/word-image-3954-300x162.png 300w, /wp-content/uploads/2018/05/word-image-3954-768x414.png 768w, /wp-content/uploads/2018/05/word-image-3954-1024x552.png 1024w" sizes="(max-width: 1037px) 100vw, 1037px" /></p>
<p>
  ②绑定图片的点击事件触发ajax
</p>
<p><img loading="lazy" decoding="async" width="1056" height="670" src="/wp-content/uploads/2018/05/word-image-3955.png" class="wp-image-4422" srcset="/wp-content/uploads/2018/05/word-image-3955.png 1056w, /wp-content/uploads/2018/05/word-image-3955-300x190.png 300w, /wp-content/uploads/2018/05/word-image-3955-768x487.png 768w, /wp-content/uploads/2018/05/word-image-3955-1024x650.png 1024w" sizes="(max-width: 1056px) 100vw, 1056px" /></p>
<p>
  ③创建方法处理删除图片请求
</p>
<p><img loading="lazy" decoding="async" width="977" height="345" src="/wp-content/uploads/2018/05/word-image-3956.png" class="wp-image-4423" srcset="/wp-content/uploads/2018/05/word-image-3956.png 977w, /wp-content/uploads/2018/05/word-image-3956-300x106.png 300w, /wp-content/uploads/2018/05/word-image-3956-768x271.png 768w" sizes="(max-width: 977px) 100vw, 977px" /></p>
<p>
  ④ajax成功处理dom元素移除
</p>
<p><img loading="lazy" decoding="async" width="1028" height="655" src="/wp-content/uploads/2018/05/word-image-3957.png" class="wp-image-4425" srcset="/wp-content/uploads/2018/05/word-image-3957.png 1028w, /wp-content/uploads/2018/05/word-image-3957-300x191.png 300w, /wp-content/uploads/2018/05/word-image-3957-768x489.png 768w, /wp-content/uploads/2018/05/word-image-3957-1024x652.png 1024w" sizes="(max-width: 1028px) 100vw, 1028px" /></p>
<h1>前台页面显示</h1>
<h2>首页显示</h2>
<p>
  ①修改前台index控制器中的index方法
</p>
<p><img loading="lazy" decoding="async" width="918" height="360" src="/wp-content/uploads/2018/05/word-image-3958.png" class="wp-image-4426" srcset="/wp-content/uploads/2018/05/word-image-3958.png 918w, /wp-content/uploads/2018/05/word-image-3958-300x118.png 300w, /wp-content/uploads/2018/05/word-image-3958-768x301.png 768w" sizes="(max-width: 918px) 100vw, 918px" /></p>
<p>
  ②拷贝前台模板文件
</p>
<p><img loading="lazy" decoding="async" width="1152" height="542" src="/wp-content/uploads/2018/05/word-image-3959.png" class="wp-image-4427" srcset="/wp-content/uploads/2018/05/word-image-3959.png 1152w, /wp-content/uploads/2018/05/word-image-3959-300x141.png 300w, /wp-content/uploads/2018/05/word-image-3959-768x361.png 768w, /wp-content/uploads/2018/05/word-image-3959-1024x482.png 1024w" sizes="(max-width: 1152px) 100vw, 1152px" /></p>
<p>
  ③拷贝资源文件
</p>
<p><img loading="lazy" decoding="async" width="1146" height="495" src="/wp-content/uploads/2018/05/word-image-3960.png" class="wp-image-4428" srcset="/wp-content/uploads/2018/05/word-image-3960.png 1146w, /wp-content/uploads/2018/05/word-image-3960-300x130.png 300w, /wp-content/uploads/2018/05/word-image-3960-768x332.png 768w, /wp-content/uploads/2018/05/word-image-3960-1024x442.png 1024w" sizes="(max-width: 1146px) 100vw, 1146px" /></p>
<p>
  ④替换资源地址
</p>
<p><img loading="lazy" decoding="async" width="1102" height="671" src="/wp-content/uploads/2018/05/word-image-3961.png" class="wp-image-4429" srcset="/wp-content/uploads/2018/05/word-image-3961.png 1102w, /wp-content/uploads/2018/05/word-image-3961-300x183.png 300w, /wp-content/uploads/2018/05/word-image-3961-768x468.png 768w, /wp-content/uploads/2018/05/word-image-3961-1024x624.png 1024w" sizes="(max-width: 1102px) 100vw, 1102px" /></p>
<h2>使用版本号(了解)</h2>
<p>
  版本号可以控制资源文件的缓存更新
</p>
<p>
  ①在配置文件中增加配置
</p>
<p><img loading="lazy" decoding="async" width="1031" height="474" src="/wp-content/uploads/2018/05/word-image-3962.png" class="wp-image-4430" srcset="/wp-content/uploads/2018/05/word-image-3962.png 1031w, /wp-content/uploads/2018/05/word-image-3962-300x138.png 300w, /wp-content/uploads/2018/05/word-image-3962-768x353.png 768w, /wp-content/uploads/2018/05/word-image-3962-1024x471.png 1024w" sizes="(max-width: 1031px) 100vw, 1031px" /></p>
<p>
  ②在模板中使用
</p>
<p><img loading="lazy" decoding="async" width="1064" height="686" src="/wp-content/uploads/2018/05/word-image-3963.png" class="wp-image-4431" srcset="/wp-content/uploads/2018/05/word-image-3963.png 1064w, /wp-content/uploads/2018/05/word-image-3963-300x193.png 300w, /wp-content/uploads/2018/05/word-image-3963-768x495.png 768w, /wp-content/uploads/2018/05/word-image-3963-1024x660.png 1024w" sizes="(max-width: 1064px) 100vw, 1064px" /></p>
<h2>页头页尾的公用</h2>
<p>
  ①提取头部HTML代码
</p>
<p><img loading="lazy" decoding="async" width="1105" height="571" src="/wp-content/uploads/2018/05/word-image-3964.png" class="wp-image-4432" srcset="/wp-content/uploads/2018/05/word-image-3964.png 1105w, /wp-content/uploads/2018/05/word-image-3964-300x155.png 300w, /wp-content/uploads/2018/05/word-image-3964-768x397.png 768w, /wp-content/uploads/2018/05/word-image-3964-1024x529.png 1024w" sizes="(max-width: 1105px) 100vw, 1105px" /></p>
<p>
  ②在index模板中引入头部
</p>
<p><img loading="lazy" decoding="async" width="948" height="597" src="/wp-content/uploads/2018/05/word-image-3965.png" class="wp-image-4433" srcset="/wp-content/uploads/2018/05/word-image-3965.png 948w, /wp-content/uploads/2018/05/word-image-3965-300x189.png 300w, /wp-content/uploads/2018/05/word-image-3965-768x484.png 768w" sizes="(max-width: 948px) 100vw, 948px" /></p>
<p>
  ③提取底部的HTML代码
</p>
<p><img loading="lazy" decoding="async" width="1042" height="450" src="/wp-content/uploads/2018/05/word-image-3966.png" class="wp-image-4434" srcset="/wp-content/uploads/2018/05/word-image-3966.png 1042w, /wp-content/uploads/2018/05/word-image-3966-300x130.png 300w, /wp-content/uploads/2018/05/word-image-3966-768x332.png 768w, /wp-content/uploads/2018/05/word-image-3966-1024x442.png 1024w" sizes="(max-width: 1042px) 100vw, 1042px" /></p>
<p>
  ④index模板引入底部的代码
</p>
<p><img loading="lazy" decoding="async" width="971" height="597" src="/wp-content/uploads/2018/05/word-image-3967.png" class="wp-image-4435" srcset="/wp-content/uploads/2018/05/word-image-3967.png 971w, /wp-content/uploads/2018/05/word-image-3967-300x184.png 300w, /wp-content/uploads/2018/05/word-image-3967-768x472.png 768w" sizes="(max-width: 971px) 100vw, 971px" /></p>
<h2>显示商品列表页</h2>
<p>
  ①创建控制器方法显示模板
</p>
<p><img loading="lazy" decoding="async" width="933" height="391" src="/wp-content/uploads/2018/05/word-image-3968.png" class="wp-image-4436" srcset="/wp-content/uploads/2018/05/word-image-3968.png 933w, /wp-content/uploads/2018/05/word-image-3968-300x126.png 300w, /wp-content/uploads/2018/05/word-image-3968-768x322.png 768w" sizes="(max-width: 933px) 100vw, 933px" /></p>
<p>
  ②拷贝模板文件
</p>
<p><img loading="lazy" decoding="async" width="1121" height="512" src="/wp-content/uploads/2018/05/word-image-3969.png" class="wp-image-4437" srcset="/wp-content/uploads/2018/05/word-image-3969.png 1121w, /wp-content/uploads/2018/05/word-image-3969-300x137.png 300w, /wp-content/uploads/2018/05/word-image-3969-768x351.png 768w, /wp-content/uploads/2018/05/word-image-3969-1024x468.png 1024w" sizes="(max-width: 1121px) 100vw, 1121px" /></p>
<p>
  ③修改模板
</p>
<p><img loading="lazy" decoding="async" width="1059" height="710" src="/wp-content/uploads/2018/05/word-image-3970.png" class="wp-image-4438" srcset="/wp-content/uploads/2018/05/word-image-3970.png 1059w, /wp-content/uploads/2018/05/word-image-3970-300x201.png 300w, /wp-content/uploads/2018/05/word-image-3970-768x515.png 768w, /wp-content/uploads/2018/05/word-image-3970-1024x687.png 1024w" sizes="(max-width: 1059px) 100vw, 1059px" /></p>
<p>
  ④解决头部导航菜单展开与收缩效果
</p>
<p>
  先在index控制器下的index方法中赋予标识符
</p>
<p><img loading="lazy" decoding="async" width="934" height="442" src="/wp-content/uploads/2018/05/word-image-3971.png" class="wp-image-4439" srcset="/wp-content/uploads/2018/05/word-image-3971.png 934w, /wp-content/uploads/2018/05/word-image-3971-300x142.png 300w, /wp-content/uploads/2018/05/word-image-3971-768x363.png 768w" sizes="(max-width: 934px) 100vw, 934px" /></p>
<p>
  在模板中判断
</p>
<p><img loading="lazy" decoding="async" width="1124" height="671" src="/wp-content/uploads/2018/05/word-image-3972.png" class="wp-image-4440" srcset="/wp-content/uploads/2018/05/word-image-3972.png 1124w, /wp-content/uploads/2018/05/word-image-3972-300x179.png 300w, /wp-content/uploads/2018/05/word-image-3972-768x458.png 768w, /wp-content/uploads/2018/05/word-image-3972-1024x611.png 1024w" sizes="(max-width: 1124px) 100vw, 1124px" /></p>
<h2>商品详情页显示</h2>
<p>
  ①创建控制器方法加载模板
</p>
<p><img loading="lazy" decoding="async" width="980" height="408" src="/wp-content/uploads/2018/05/word-image-3973.png" class="wp-image-4441" srcset="/wp-content/uploads/2018/05/word-image-3973.png 980w, /wp-content/uploads/2018/05/word-image-3973-300x125.png 300w, /wp-content/uploads/2018/05/word-image-3973-768x320.png 768w" sizes="(max-width: 980px) 100vw, 980px" /></p>
<p>
  ②拷贝模板
</p>
<p><img loading="lazy" decoding="async" width="1127" height="467" src="/wp-content/uploads/2018/05/word-image-3974.png" class="wp-image-4442" srcset="/wp-content/uploads/2018/05/word-image-3974.png 1127w, /wp-content/uploads/2018/05/word-image-3974-300x124.png 300w, /wp-content/uploads/2018/05/word-image-3974-768x318.png 768w, /wp-content/uploads/2018/05/word-image-3974-1024x424.png 1024w" sizes="(max-width: 1127px) 100vw, 1127px" /></p>
<p>
  ③处理模板资源地址
</p>
<p><img loading="lazy" decoding="async" width="1104" height="679" src="/wp-content/uploads/2018/05/word-image-3975.png" class="wp-image-4443" srcset="/wp-content/uploads/2018/05/word-image-3975.png 1104w, /wp-content/uploads/2018/05/word-image-3975-300x185.png 300w, /wp-content/uploads/2018/05/word-image-3975-768x472.png 768w, /wp-content/uploads/2018/05/word-image-3975-1024x630.png 1024w" sizes="(max-width: 1104px) 100vw, 1104px" /></p>
<p>
  ④模板公用
</p>
<p><img loading="lazy" decoding="async" width="1108" height="637" src="/wp-content/uploads/2018/05/word-image-3976.png" class="wp-image-4444" srcset="/wp-content/uploads/2018/05/word-image-3976.png 1108w, /wp-content/uploads/2018/05/word-image-3976-300x172.png 300w, /wp-content/uploads/2018/05/word-image-3976-768x442.png 768w, /wp-content/uploads/2018/05/word-image-3976-1024x589.png 1024w" sizes="(max-width: 1108px) 100vw, 1108px" /></p>
<h2>显示导航商品分类信息</h2>
<p>
  ①修改index方法获取数据
</p>
<p><img loading="lazy" decoding="async" width="1249" height="491" src="/wp-content/uploads/2018/05/word-image-3977.png" class="wp-image-4445" srcset="/wp-content/uploads/2018/05/word-image-3977.png 1249w, /wp-content/uploads/2018/05/word-image-3977-300x118.png 300w, /wp-content/uploads/2018/05/word-image-3977-768x302.png 768w, /wp-content/uploads/2018/05/word-image-3977-1024x403.png 1024w" sizes="(max-width: 1249px) 100vw, 1249px" /></p>
<p>
  结果如下
</p>
<p><img loading="lazy" decoding="async" width="941" height="569" src="/wp-content/uploads/2018/05/word-image-3978.png" class="wp-image-4446" srcset="/wp-content/uploads/2018/05/word-image-3978.png 941w, /wp-content/uploads/2018/05/word-image-3978-300x181.png 300w, /wp-content/uploads/2018/05/word-image-3978-768x464.png 768w" sizes="(max-width: 941px) 100vw, 941px" /></p>
<p>
  ②创建公共控制器构造方法获取数分类数据
</p>
<p><img loading="lazy" decoding="async" width="952" height="643" src="/wp-content/uploads/2018/05/word-image-3979.png" class="wp-image-4447" srcset="/wp-content/uploads/2018/05/word-image-3979.png 952w, /wp-content/uploads/2018/05/word-image-3979-300x203.png 300w, /wp-content/uploads/2018/05/word-image-3979-768x519.png 768w, /wp-content/uploads/2018/05/word-image-3979-220x150.png 220w" sizes="(max-width: 952px) 100vw, 952px" /></p>
<p>
  ③修改 其他控制器的继承关系
</p>
<p>
  修改index控制器
</p>
<p><img loading="lazy" decoding="async" width="940" height="598" src="/wp-content/uploads/2018/05/word-image-3980.png" class="wp-image-4448" srcset="/wp-content/uploads/2018/05/word-image-3980.png 940w, /wp-content/uploads/2018/05/word-image-3980-300x191.png 300w, /wp-content/uploads/2018/05/word-image-3980-768x489.png 768w" sizes="(max-width: 940px) 100vw, 940px" /></p>
<p>
  修改category控制器
</p>
<p><img loading="lazy" decoding="async" width="998" height="412" src="/wp-content/uploads/2018/05/word-image-3981.png" class="wp-image-4449" srcset="/wp-content/uploads/2018/05/word-image-3981.png 998w, /wp-content/uploads/2018/05/word-image-3981-300x124.png 300w, /wp-content/uploads/2018/05/word-image-3981-768x317.png 768w" sizes="(max-width: 998px) 100vw, 998px" /></p>
<p>
  修改goods控制器
</p>
<p><img loading="lazy" decoding="async" width="915" height="389" src="/wp-content/uploads/2018/05/word-image-3982.png" class="wp-image-4450" srcset="/wp-content/uploads/2018/05/word-image-3982.png 915w, /wp-content/uploads/2018/05/word-image-3982-300x128.png 300w, /wp-content/uploads/2018/05/word-image-3982-768x327.png 768w" sizes="(max-width: 915px) 100vw, 915px" /></p>
<p>
  ④显示第一层分类信息
</p>
<p><img loading="lazy" decoding="async" width="1125" height="671" src="/wp-content/uploads/2018/05/word-image-3983.png" class="wp-image-4451" srcset="/wp-content/uploads/2018/05/word-image-3983.png 1125w, /wp-content/uploads/2018/05/word-image-3983-300x179.png 300w, /wp-content/uploads/2018/05/word-image-3983-768x458.png 768w, /wp-content/uploads/2018/05/word-image-3983-1024x611.png 1024w" sizes="(max-width: 1125px) 100vw, 1125px" /><br />
<img loading="lazy" decoding="async" width="1317" height="516" src="/wp-content/uploads/2018/05/word-image-3984.png" class="wp-image-4452" srcset="/wp-content/uploads/2018/05/word-image-3984.png 1317w, /wp-content/uploads/2018/05/word-image-3984-300x118.png 300w, /wp-content/uploads/2018/05/word-image-3984-768x301.png 768w, /wp-content/uploads/2018/05/word-image-3984-1024x401.png 1024w" sizes="(max-width: 1317px) 100vw, 1317px" /></p>
<p>
  ⑤显示第二层菜单
</p>
<p><img loading="lazy" decoding="async" width="1164" height="706" src="/wp-content/uploads/2018/05/word-image-3985.png" class="wp-image-4453" srcset="/wp-content/uploads/2018/05/word-image-3985.png 1164w, /wp-content/uploads/2018/05/word-image-3985-300x182.png 300w, /wp-content/uploads/2018/05/word-image-3985-768x466.png 768w, /wp-content/uploads/2018/05/word-image-3985-1024x621.png 1024w" sizes="(max-width: 1164px) 100vw, 1164px" /><br />
<img loading="lazy" decoding="async" width="820" height="322" src="/wp-content/uploads/2018/05/word-image-3986.png" class="wp-image-4454" srcset="/wp-content/uploads/2018/05/word-image-3986.png 820w, /wp-content/uploads/2018/05/word-image-3986-300x118.png 300w, /wp-content/uploads/2018/05/word-image-3986-768x302.png 768w" sizes="(max-width: 820px) 100vw, 820px" /></p>
<p>
  ⑥显示第三层导航菜单
</p>
<p><img loading="lazy" decoding="async" width="1163" height="591" src="/wp-content/uploads/2018/05/word-image-3987.png" class="wp-image-4455" srcset="/wp-content/uploads/2018/05/word-image-3987.png 1163w, /wp-content/uploads/2018/05/word-image-3987-300x152.png 300w, /wp-content/uploads/2018/05/word-image-3987-768x390.png 768w, /wp-content/uploads/2018/05/word-image-3987-1024x520.png 1024w" sizes="(max-width: 1163px) 100vw, 1163px" /><br />
<img loading="lazy" decoding="async" width="997" height="635" src="/wp-content/uploads/2018/05/word-image-3988.png" class="wp-image-4456" srcset="/wp-content/uploads/2018/05/word-image-3988.png 997w, /wp-content/uploads/2018/05/word-image-3988-300x191.png 300w, /wp-content/uploads/2018/05/word-image-3988-768x489.png 768w" sizes="(max-width: 997px) 100vw, 997px" /></p>
<h2>显示首页中的推荐商品</h2>
<p>
  ①自定义模型创建方法可以获取推荐商品
</p>
<p><img loading="lazy" decoding="async" width="1053" height="704" src="/wp-content/uploads/2018/05/word-image-3989.png" class="wp-image-4457" srcset="/wp-content/uploads/2018/05/word-image-3989.png 1053w, /wp-content/uploads/2018/05/word-image-3989-300x201.png 300w, /wp-content/uploads/2018/05/word-image-3989-768x513.png 768w, /wp-content/uploads/2018/05/word-image-3989-1024x685.png 1024w" sizes="(max-width: 1053px) 100vw, 1053px" /></p>
<p>
  ②在控制器中获取推荐的商品
</p>
<p><img loading="lazy" decoding="async" width="1049" height="641" src="/wp-content/uploads/2018/05/word-image-3990.png" class="wp-image-4458" srcset="/wp-content/uploads/2018/05/word-image-3990.png 1049w, /wp-content/uploads/2018/05/word-image-3990-300x183.png 300w, /wp-content/uploads/2018/05/word-image-3990-768x469.png 768w, /wp-content/uploads/2018/05/word-image-3990-1024x626.png 1024w" sizes="(max-width: 1049px) 100vw, 1049px" /></p>
<p>
  ③修改配置项指定资源地址
</p>
<p><img loading="lazy" decoding="async" width="1040" height="620" src="/wp-content/uploads/2018/05/word-image-3991.png" class="wp-image-4459" srcset="/wp-content/uploads/2018/05/word-image-3991.png 1040w, /wp-content/uploads/2018/05/word-image-3991-300x179.png 300w, /wp-content/uploads/2018/05/word-image-3991-768x458.png 768w, /wp-content/uploads/2018/05/word-image-3991-1024x610.png 1024w" sizes="(max-width: 1040px) 100vw, 1040px" /></p>
<p>
  ④模板显示数据
</p>
<p><img loading="lazy" decoding="async" width="1064" height="701" src="/wp-content/uploads/2018/05/word-image-3992.png" class="wp-image-4460" srcset="/wp-content/uploads/2018/05/word-image-3992.png 1064w, /wp-content/uploads/2018/05/word-image-3992-300x198.png 300w, /wp-content/uploads/2018/05/word-image-3992-768x506.png 768w, /wp-content/uploads/2018/05/word-image-3992-1024x675.png 1024w" sizes="(max-width: 1064px) 100vw, 1064px" /><br />
<img loading="lazy" decoding="async" width="982" height="330" src="/wp-content/uploads/2018/05/word-image-3993.png" class="wp-image-4461" srcset="/wp-content/uploads/2018/05/word-image-3993.png 982w, /wp-content/uploads/2018/05/word-image-3993-300x101.png 300w, /wp-content/uploads/2018/05/word-image-3993-768x258.png 768w" sizes="(max-width: 982px) 100vw, 982px" /></p>
<h1>用户注册</h1>
<h2>用户数据表创建</h2>
<p>
  CREATE TABLE `shop_user` (
</p>
<p>
    `id` int(11) NOT NULL,
</p>
<p>
    `username` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;用户名&#8217;,
</p>
<p>
    `password` char(32) NOT NULL DEFAULT &#8221; COMMENT &#8216;密码&#8217;,
</p>
<p>
    PRIMARY KEY (`id`)
</p>
<p>
  ) ENGINE=InnoDB DEFAULT CHARSET=utf8;
</p>
<h2>显示用户注册页</h2>
<p>
  ①创建方法加载模板
</p>
<p><img loading="lazy" decoding="async" width="939" height="573" src="/wp-content/uploads/2018/05/word-image-3994.png" class="wp-image-4462" srcset="/wp-content/uploads/2018/05/word-image-3994.png 939w, /wp-content/uploads/2018/05/word-image-3994-300x183.png 300w, /wp-content/uploads/2018/05/word-image-3994-768x469.png 768w" sizes="(max-width: 939px) 100vw, 939px" /></p>
<p>
  ②拷贝模板文件
</p>
<p><img loading="lazy" decoding="async" width="1105" height="496" src="/wp-content/uploads/2018/05/word-image-3995.png" class="wp-image-4463" srcset="/wp-content/uploads/2018/05/word-image-3995.png 1105w, /wp-content/uploads/2018/05/word-image-3995-300x135.png 300w, /wp-content/uploads/2018/05/word-image-3995-768x345.png 768w, /wp-content/uploads/2018/05/word-image-3995-1024x460.png 1024w" sizes="(max-width: 1105px) 100vw, 1105px" /></p>
<p>
  ③修改模板提取头部
</p>
<p><img loading="lazy" decoding="async" width="1070" height="591" src="/wp-content/uploads/2018/05/word-image-3996.png" class="wp-image-4464" srcset="/wp-content/uploads/2018/05/word-image-3996.png 1070w, /wp-content/uploads/2018/05/word-image-3996-300x166.png 300w, /wp-content/uploads/2018/05/word-image-3996-768x424.png 768w, /wp-content/uploads/2018/05/word-image-3996-1024x566.png 1024w" sizes="(max-width: 1070px) 100vw, 1070px" /></p>
<p>
  ④修改注册模板
</p>
<p><img loading="lazy" decoding="async" width="878" height="576" src="/wp-content/uploads/2018/05/word-image-3997.png" class="wp-image-4465" srcset="/wp-content/uploads/2018/05/word-image-3997.png 878w, /wp-content/uploads/2018/05/word-image-3997-300x197.png 300w, /wp-content/uploads/2018/05/word-image-3997-768x504.png 768w" sizes="(max-width: 878px) 100vw, 878px" /></p>
<p>
  ⑤修改footer.html模板
</p>
<p><img loading="lazy" decoding="async" width="884" height="349" src="/wp-content/uploads/2018/05/word-image-3998.png" class="wp-image-4466" srcset="/wp-content/uploads/2018/05/word-image-3998.png 884w, /wp-content/uploads/2018/05/word-image-3998-300x118.png 300w, /wp-content/uploads/2018/05/word-image-3998-768x303.png 768w" sizes="(max-width: 884px) 100vw, 884px" /></p>
<h2>实现注册入库</h2>
<p>
  ①修改方法
</p>
<p><img loading="lazy" decoding="async" width="961" height="694" src="/wp-content/uploads/2018/05/word-image-3999.png" class="wp-image-4467" srcset="/wp-content/uploads/2018/05/word-image-3999.png 961w, /wp-content/uploads/2018/05/word-image-3999-300x217.png 300w, /wp-content/uploads/2018/05/word-image-3999-768x555.png 768w" sizes="(max-width: 961px) 100vw, 961px" /></p>
<p>
  ②创建模型
</p>
<p><img loading="lazy" decoding="async" width="1083" height="702" src="/wp-content/uploads/2018/05/word-image-4000.png" class="wp-image-4468" srcset="/wp-content/uploads/2018/05/word-image-4000.png 1083w, /wp-content/uploads/2018/05/word-image-4000-300x194.png 300w, /wp-content/uploads/2018/05/word-image-4000-768x498.png 768w, /wp-content/uploads/2018/05/word-image-4000-1024x664.png 1024w" sizes="(max-width: 1083px) 100vw, 1083px" /></p>
]]></content:encoded>
					
					<wfw:commentRss>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4389.html/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>TP3.2商城 （六）前台登录、商品展示、商品详情页、购物车</title>
		<link>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4315.html</link>
					<comments>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4315.html#respond</comments>
		
		<dc:creator><![CDATA[Mr.Lee]]></dc:creator>
		<pubDate>Sat, 19 May 2018 12:36:42 +0000</pubDate>
				<category><![CDATA[TP3.2]]></category>
		<category><![CDATA[TP3.2商城]]></category>
		<category><![CDATA[后台框架]]></category>
		<category><![CDATA[前台登录]]></category>
		<category><![CDATA[商品展示]]></category>
		<category><![CDATA[商品详情页]]></category>
		<category><![CDATA[购物车]]></category>
		<guid isPermaLink="false">/?p=4315</guid>

					<description><![CDATA[用户登录 显示用户登录界面 ①创建方法加载模板 ②拷贝登录模板 ③修改模板 实现登录 ①控制器调用模型方法实现 [&#8230;]]]></description>
										<content:encoded><![CDATA[<h1>用户登录</h1>
<h2>显示用户登录界面</h2>
<p>
  ①创建方法加载模板
</p>
<p><img loading="lazy" decoding="async" width="840" height="435" src="/wp-content/uploads/2018/05/word-image-3852.png" class="wp-image-4316" srcset="/wp-content/uploads/2018/05/word-image-3852.png 840w, /wp-content/uploads/2018/05/word-image-3852-300x155.png 300w, /wp-content/uploads/2018/05/word-image-3852-768x398.png 768w" sizes="(max-width: 840px) 100vw, 840px" /></p>
<p>
  ②拷贝登录模板
</p>
<p><img loading="lazy" decoding="async" width="1163" height="553" src="/wp-content/uploads/2018/05/word-image-3853.png" class="wp-image-4317" srcset="/wp-content/uploads/2018/05/word-image-3853.png 1163w, /wp-content/uploads/2018/05/word-image-3853-300x143.png 300w, /wp-content/uploads/2018/05/word-image-3853-768x365.png 768w, /wp-content/uploads/2018/05/word-image-3853-1024x487.png 1024w" sizes="(max-width: 1163px) 100vw, 1163px" /></p>
<p>
  ③修改模板
</p>
<p><img loading="lazy" decoding="async" width="1079" height="690" src="/wp-content/uploads/2018/05/word-image-3854.png" class="wp-image-4318" srcset="/wp-content/uploads/2018/05/word-image-3854.png 1079w, /wp-content/uploads/2018/05/word-image-3854-300x192.png 300w, /wp-content/uploads/2018/05/word-image-3854-768x491.png 768w, /wp-content/uploads/2018/05/word-image-3854-1024x655.png 1024w" sizes="(max-width: 1079px) 100vw, 1079px" /><br />
<img loading="lazy" decoding="async" width="1189" height="534" src="/wp-content/uploads/2018/05/word-image-3855.png" class="wp-image-4319" srcset="/wp-content/uploads/2018/05/word-image-3855.png 1189w, /wp-content/uploads/2018/05/word-image-3855-300x135.png 300w, /wp-content/uploads/2018/05/word-image-3855-768x345.png 768w, /wp-content/uploads/2018/05/word-image-3855-1024x460.png 1024w" sizes="(max-width: 1189px) 100vw, 1189px" /></p>
<h2>实现登录</h2>
<p>
  ①控制器调用模型方法实现登录
</p>
<p><img loading="lazy" decoding="async" width="1068" height="675" src="/wp-content/uploads/2018/05/word-image-3856.png" class="wp-image-4320" srcset="/wp-content/uploads/2018/05/word-image-3856.png 1068w, /wp-content/uploads/2018/05/word-image-3856-300x190.png 300w, /wp-content/uploads/2018/05/word-image-3856-768x485.png 768w, /wp-content/uploads/2018/05/word-image-3856-1024x647.png 1024w" sizes="(max-width: 1068px) 100vw, 1068px" /></p>
<p>
  ②创建模型方法登录
</p>
<p><img loading="lazy" decoding="async" width="962" height="692" src="/wp-content/uploads/2018/05/word-image-3857.png" class="wp-image-4321" srcset="/wp-content/uploads/2018/05/word-image-3857.png 962w, /wp-content/uploads/2018/05/word-image-3857-300x216.png 300w, /wp-content/uploads/2018/05/word-image-3857-768x552.png 768w" sizes="(max-width: 962px) 100vw, 962px" /></p>
<h2>使用cookie加密</h2>
<p>
  ①拷贝加密解密函数
</p>
<p><img loading="lazy" decoding="async" width="943" height="702" src="/wp-content/uploads/2018/05/word-image-3858.png" class="wp-image-4322" srcset="/wp-content/uploads/2018/05/word-image-3858.png 943w, /wp-content/uploads/2018/05/word-image-3858-300x223.png 300w, /wp-content/uploads/2018/05/word-image-3858-768x572.png 768w" sizes="(max-width: 943px) 100vw, 943px" /></p>
<p>
  ②创建测试方法使用加密解密
</p>
<p><img loading="lazy" decoding="async" width="895" height="611" src="/wp-content/uploads/2018/05/word-image-3859.png" class="wp-image-4324" srcset="/wp-content/uploads/2018/05/word-image-3859.png 895w, /wp-content/uploads/2018/05/word-image-3859-300x205.png 300w, /wp-content/uploads/2018/05/word-image-3859-768x524.png 768w, /wp-content/uploads/2018/05/word-image-3859-220x150.png 220w" sizes="(max-width: 895px) 100vw, 895px" /><br />
<img loading="lazy" decoding="async" width="691" height="175" src="/wp-content/uploads/2018/05/word-image-3860.png" class="wp-image-4325" srcset="/wp-content/uploads/2018/05/word-image-3860.png 691w, /wp-content/uploads/2018/05/word-image-3860-300x76.png 300w" sizes="(max-width: 691px) 100vw, 691px" /></p>
<p>
  ③针对登录使用加密解密函数
</p>
<p><img loading="lazy" decoding="async" width="1051" height="679" src="/wp-content/uploads/2018/05/word-image-3861.png" class="wp-image-4326" srcset="/wp-content/uploads/2018/05/word-image-3861.png 1051w, /wp-content/uploads/2018/05/word-image-3861-300x194.png 300w, /wp-content/uploads/2018/05/word-image-3861-768x496.png 768w, /wp-content/uploads/2018/05/word-image-3861-1024x662.png 1024w" sizes="(max-width: 1051px) 100vw, 1051px" /></p>
<p>
  ④修改测试方法查看结果
</p>
<p><img loading="lazy" decoding="async" width="987" height="680" src="/wp-content/uploads/2018/05/word-image-3862.png" class="wp-image-4327" srcset="/wp-content/uploads/2018/05/word-image-3862.png 987w, /wp-content/uploads/2018/05/word-image-3862-300x207.png 300w, /wp-content/uploads/2018/05/word-image-3862-768x529.png 768w" sizes="(max-width: 987px) 100vw, 987px" /><br />
<img loading="lazy" decoding="async" width="590" height="242" src="/wp-content/uploads/2018/05/word-image-3863.png" class="wp-image-4328" srcset="/wp-content/uploads/2018/05/word-image-3863.png 590w, /wp-content/uploads/2018/05/word-image-3863-300x123.png 300w" sizes="(max-width: 590px) 100vw, 590px" /></p>
<h1>商品详情页数据展示</h1>
<h2>显示商品基本信息</h2>
<p>
  ①获取商品基本信息
</p>
<p><img loading="lazy" decoding="async" width="1061" height="688" src="/wp-content/uploads/2018/05/word-image-3864.png" class="wp-image-4329" srcset="/wp-content/uploads/2018/05/word-image-3864.png 1061w, /wp-content/uploads/2018/05/word-image-3864-300x195.png 300w, /wp-content/uploads/2018/05/word-image-3864-768x498.png 768w, /wp-content/uploads/2018/05/word-image-3864-1024x664.png 1024w" sizes="(max-width: 1061px) 100vw, 1061px" /></p>
<p>
  ②修改模板显示数据
</p>
<p><img loading="lazy" decoding="async" width="1076" height="626" src="/wp-content/uploads/2018/05/word-image-3865.png" class="wp-image-4330" srcset="/wp-content/uploads/2018/05/word-image-3865.png 1076w, /wp-content/uploads/2018/05/word-image-3865-300x175.png 300w, /wp-content/uploads/2018/05/word-image-3865-768x447.png 768w, /wp-content/uploads/2018/05/word-image-3865-1024x596.png 1024w" sizes="(max-width: 1076px) 100vw, 1076px" /><br />
<img loading="lazy" decoding="async" width="1044" height="420" src="/wp-content/uploads/2018/05/word-image-3866.png" class="wp-image-4331" srcset="/wp-content/uploads/2018/05/word-image-3866.png 1044w, /wp-content/uploads/2018/05/word-image-3866-300x121.png 300w, /wp-content/uploads/2018/05/word-image-3866-768x309.png 768w, /wp-content/uploads/2018/05/word-image-3866-1024x412.png 1024w" sizes="(max-width: 1044px) 100vw, 1044px" /></p>
<p>
  ③处理详情信息
</p>
<p><img loading="lazy" decoding="async" width="1014" height="699" src="/wp-content/uploads/2018/05/word-image-3867.png" class="wp-image-4332" srcset="/wp-content/uploads/2018/05/word-image-3867.png 1014w, /wp-content/uploads/2018/05/word-image-3867-300x207.png 300w, /wp-content/uploads/2018/05/word-image-3867-768x529.png 768w" sizes="(max-width: 1014px) 100vw, 1014px" /></p>
<p>
  ④显示商品详情介绍
</p>
<p><img loading="lazy" decoding="async" width="1078" height="402" src="/wp-content/uploads/2018/05/word-image-3868.png" class="wp-image-4333" srcset="/wp-content/uploads/2018/05/word-image-3868.png 1078w, /wp-content/uploads/2018/05/word-image-3868-300x112.png 300w, /wp-content/uploads/2018/05/word-image-3868-768x286.png 768w, /wp-content/uploads/2018/05/word-image-3868-1024x382.png 1024w" sizes="(max-width: 1078px) 100vw, 1078px" /><br />
<img loading="lazy" decoding="async" width="931" height="312" src="/wp-content/uploads/2018/05/word-image-3869.png" class="wp-image-4334" srcset="/wp-content/uploads/2018/05/word-image-3869.png 931w, /wp-content/uploads/2018/05/word-image-3869-300x101.png 300w, /wp-content/uploads/2018/05/word-image-3869-768x257.png 768w" sizes="(max-width: 931px) 100vw, 931px" /></p>
<h2>显示商品相册</h2>
<p>
  ①修改方法获取相册
</p>
<p><img loading="lazy" decoding="async" width="1100" height="696" src="/wp-content/uploads/2018/05/word-image-3870.png" class="wp-image-4335" srcset="/wp-content/uploads/2018/05/word-image-3870.png 1100w, /wp-content/uploads/2018/05/word-image-3870-300x190.png 300w, /wp-content/uploads/2018/05/word-image-3870-768x486.png 768w, /wp-content/uploads/2018/05/word-image-3870-1024x648.png 1024w" sizes="(max-width: 1100px) 100vw, 1100px" /></p>
<p>
  ②修改模板显示图片
</p>
<p>
  第一张图片
</p>
<p><img loading="lazy" decoding="async" width="1123" height="437" src="/wp-content/uploads/2018/05/word-image-3871.png" class="wp-image-4336" srcset="/wp-content/uploads/2018/05/word-image-3871.png 1123w, /wp-content/uploads/2018/05/word-image-3871-300x117.png 300w, /wp-content/uploads/2018/05/word-image-3871-768x299.png 768w, /wp-content/uploads/2018/05/word-image-3871-1024x398.png 1024w" sizes="(max-width: 1123px) 100vw, 1123px" /></p>
<p>
  其他图片
</p>
<p><img loading="lazy" decoding="async" width="1120" height="699" src="/wp-content/uploads/2018/05/word-image-3872.png" class="wp-image-4337" srcset="/wp-content/uploads/2018/05/word-image-3872.png 1120w, /wp-content/uploads/2018/05/word-image-3872-300x187.png 300w, /wp-content/uploads/2018/05/word-image-3872-768x479.png 768w, /wp-content/uploads/2018/05/word-image-3872-1024x639.png 1024w" sizes="(max-width: 1120px) 100vw, 1120px" /><br />
<img loading="lazy" decoding="async" width="808" height="531" src="/wp-content/uploads/2018/05/word-image-3873.png" class="wp-image-4338" srcset="/wp-content/uploads/2018/05/word-image-3873.png 808w, /wp-content/uploads/2018/05/word-image-3873-300x197.png 300w, /wp-content/uploads/2018/05/word-image-3873-768x505.png 768w" sizes="(max-width: 808px) 100vw, 808px" /></p>
<h2>显示商品属性信息</h2>
<p>
  ①使用原生的sql语句获取商品属性信息
</p>
<p><img loading="lazy" decoding="async" width="1048" height="482" src="/wp-content/uploads/2018/05/word-image-3874.png" class="wp-image-4339" srcset="/wp-content/uploads/2018/05/word-image-3874.png 1048w, /wp-content/uploads/2018/05/word-image-3874-300x138.png 300w, /wp-content/uploads/2018/05/word-image-3874-768x353.png 768w, /wp-content/uploads/2018/05/word-image-3874-1024x471.png 1024w" sizes="(max-width: 1048px) 100vw, 1048px" /></p>
<p>
  ②在商品方法中获取属性
</p>
<p><img loading="lazy" decoding="async" width="1154" height="637" src="/wp-content/uploads/2018/05/word-image-3875.png" class="wp-image-4340" srcset="/wp-content/uploads/2018/05/word-image-3875.png 1154w, /wp-content/uploads/2018/05/word-image-3875-300x166.png 300w, /wp-content/uploads/2018/05/word-image-3875-768x424.png 768w, /wp-content/uploads/2018/05/word-image-3875-1024x565.png 1024w" sizes="(max-width: 1154px) 100vw, 1154px" /></p>
<p>
  ③将属性信息中唯一属性拆分出来
</p>
<p><img loading="lazy" decoding="async" width="983" height="654" src="/wp-content/uploads/2018/05/word-image-3876.png" class="wp-image-4341" srcset="/wp-content/uploads/2018/05/word-image-3876.png 983w, /wp-content/uploads/2018/05/word-image-3876-300x200.png 300w, /wp-content/uploads/2018/05/word-image-3876-768x511.png 768w" sizes="(max-width: 983px) 100vw, 983px" /></p>
<p>
  ④修改模板显示唯一属性
</p>
<p><img loading="lazy" decoding="async" width="1133" height="621" src="/wp-content/uploads/2018/05/word-image-3877.png" class="wp-image-4342" srcset="/wp-content/uploads/2018/05/word-image-3877.png 1133w, /wp-content/uploads/2018/05/word-image-3877-300x164.png 300w, /wp-content/uploads/2018/05/word-image-3877-768x421.png 768w, /wp-content/uploads/2018/05/word-image-3877-1024x561.png 1024w" sizes="(max-width: 1133px) 100vw, 1133px" /><br />
<img loading="lazy" decoding="async" width="1020" height="115" src="/wp-content/uploads/2018/05/word-image-3878.png" class="wp-image-4343" srcset="/wp-content/uploads/2018/05/word-image-3878.png 1020w, /wp-content/uploads/2018/05/word-image-3878-300x34.png 300w, /wp-content/uploads/2018/05/word-image-3878-768x87.png 768w" sizes="(max-width: 1020px) 100vw, 1020px" /></p>
<p>
  ⑤修改方法将单选属性拆分出来
</p>
<p><img loading="lazy" decoding="async" width="1132" height="701" src="/wp-content/uploads/2018/05/word-image-3879.png" class="wp-image-4344" srcset="/wp-content/uploads/2018/05/word-image-3879.png 1132w, /wp-content/uploads/2018/05/word-image-3879-300x186.png 300w, /wp-content/uploads/2018/05/word-image-3879-768x476.png 768w, /wp-content/uploads/2018/05/word-image-3879-1024x634.png 1024w" sizes="(max-width: 1132px) 100vw, 1132px" /><br />
<img loading="lazy" decoding="async" width="910" height="568" src="/wp-content/uploads/2018/05/word-image-3880.png" class="wp-image-4345" srcset="/wp-content/uploads/2018/05/word-image-3880.png 910w, /wp-content/uploads/2018/05/word-image-3880-300x187.png 300w, /wp-content/uploads/2018/05/word-image-3880-768x479.png 768w" sizes="(max-width: 910px) 100vw, 910px" /></p>
<p>
  ⑥修改模板
</p>
<p><img loading="lazy" decoding="async" width="1145" height="693" src="/wp-content/uploads/2018/05/word-image-3881.png" class="wp-image-4346" srcset="/wp-content/uploads/2018/05/word-image-3881.png 1145w, /wp-content/uploads/2018/05/word-image-3881-300x182.png 300w, /wp-content/uploads/2018/05/word-image-3881-768x465.png 768w, /wp-content/uploads/2018/05/word-image-3881-1024x620.png 1024w" sizes="(max-width: 1145px) 100vw, 1145px" /><br />
<img loading="lazy" decoding="async" width="751" height="457" src="/wp-content/uploads/2018/05/word-image-3882.png" class="wp-image-4347" srcset="/wp-content/uploads/2018/05/word-image-3882.png 751w, /wp-content/uploads/2018/05/word-image-3882-300x183.png 300w" sizes="(max-width: 751px) 100vw, 751px" /></p>
<h1>购物车</h1>
<h2>3.1、购物车功能分析</h2>
<h3>3.1.1、功能分析</h3>
<p>
  1、没有登录可以使用购物车功能。需要将数据保存到cookie或者session
</p>
<p>
  2、登录之后也可以使用购物车。一般可以把购物车数据写入到数据库中。登录完成之后有数据转移操作
</p>
<p>
  3、当相同(属性也是一致)的商品再次加入购物车数量增加
</p>
<p>
  4、同一个商品属性不同在购物车显示也不一样（“货品”）
</p>
<h3>3.1.2、购物车数据保存位置</h3>
<p>
  在没有登录时购物车数据保存在cookie中，登录之后数据保存在数据库中，在用户完成登录之后需要对cookie中数据转移到数据库下
</p>
<h3>3.1.3、购物车记录什么数据</h3>
<p>
  1、需要记录商品的id标识 得到标识就可以获取到商品信息
</p>
<p>
  2、需要记录用户需要购买的单选属性信息。要的是属性值的id
</p>
<p>
  3、需要记录购买数量
</p>
<table>
<tr>
<td>
<p>
  商品id
</p>
</td>
<td>
<p>
  属性值的id组合
</p>
</td>
<td>
<p>
  数量
</p>
</td>
</tr>
<tr>
<td>
<p>
  1
</p>
</td>
<td>
<p>
  18,19
</p>
</td>
<td>
<p>
  2
</p>
</td>
</tr>
</table>
<h3>3.1.4、购物中针对不同单选属性的记录方式</h3>
<table>
<tr>
<td>
<p>
  商品id
</p>
</td>
<td>
<p>
  属性值的id组合
</p>
</td>
<td>
<p>
  数量
</p>
</td>
</tr>
<tr>
<td>
<p>
  1
</p>
</td>
<td>
<p>
  18(白色),19(32g)
</p>
</td>
<td>
<p>
  1
</p>
</td>
</tr>
<tr>
<td>
<p>
  1
</p>
</td>
<td>
<p>
  18(白色),20(64G)
</p>
</td>
<td>
<p>
  2
</p>
</td>
</tr>
</table>
<p>
  对于同一个商品，针对不同的单选属性组合对应的数据应该是多条
</p>
<h3>3.1.5、cookie存储如何存储</h3>
<p>
  对于cookie中存储数据。对于cookie本身只能存储字符串。可以使用PHP中数组格式存储数据然后在序列化之后写入。具体cookie中数据的保存安装PHP数组格式
</p>
<p>
  Array(
</p>
<p>
  Array(‘goods_id’=&gt;1,’goods_attr_id’=&gt;’18,19’,’goods_count’=&gt;2),
</p>
<p>
  Array(‘goods_id’=&gt;1,’goods_attr_id’=&gt;’18,19’,’goods_count’=&gt;2)
</p>
<p>
  )
</p>
<p>
  对于上述所写的格式是php中数组格式。当需要写入到cookie中是需要进行序列化操作
</p>
<h3>3.1.6、cookie数组中key怎么命名会方便</h3>
<p>
  当加入商品到购物车时，如果用户没有登录需要操作cookie。操作是需要先判断当前相同商品相同属性的商品信息是否存在。如果使用上面所写的二维数组格式判断需要循环遍历进行比较。可以将购物车中的数据转换为一维数组方便判断
</p>
<p>
  格式
</p>
<p>
  Array(
</p>
<p>
  ‘goods_id-goods_attr_id’=&gt;goods_count
</p>
<p>
  )
</p>
<h2>3.2、购物车数据表创建</h2>
<p>
  CREATE TABLE `shop_cart` (
</p>
<p>
    `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
</p>
<p>
    `user_id` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;用户ID&#8217;,
</p>
<p>
    `goods_id` int(11) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;商品ID&#8217;,
</p>
<p>
    `goods_attr_id` varchar(255) NOT NULL DEFAULT &#8221; COMMENT &#8216;商品属性值id组合 多个逗号隔开&#8217;,
</p>
<p>
    `goods_count` smallint(6) NOT NULL DEFAULT &#8216;0&#8217; COMMENT &#8216;购买数量&#8217;,
</p>
<p>
    PRIMARY KEY (`id`)
</p>
<p>
  ) ENGINE=InnoDB DEFAULT CHARSET=utf8;
</p>
<h2>3.3、添加商品到购物车</h2>
<p>
  ①修改加入购物车为表单提交
</p>
<p><img loading="lazy" decoding="async" width="1132" height="478" src="/wp-content/uploads/2018/05/word-image-3883.png" class="wp-image-4348" srcset="/wp-content/uploads/2018/05/word-image-3883.png 1132w, /wp-content/uploads/2018/05/word-image-3883-300x127.png 300w, /wp-content/uploads/2018/05/word-image-3883-768x324.png 768w, /wp-content/uploads/2018/05/word-image-3883-1024x432.png 1024w" sizes="(max-width: 1132px) 100vw, 1132px" /></p>
<p>
  ②创建购物车控制器
</p>
<p><img loading="lazy" decoding="async" width="1075" height="426" src="/wp-content/uploads/2018/05/word-image-3884.png" class="wp-image-4349" srcset="/wp-content/uploads/2018/05/word-image-3884.png 1075w, /wp-content/uploads/2018/05/word-image-3884-300x119.png 300w, /wp-content/uploads/2018/05/word-image-3884-768x304.png 768w, /wp-content/uploads/2018/05/word-image-3884-1024x406.png 1024w" sizes="(max-width: 1075px) 100vw, 1075px" /></p>
<p>
  ③修改购买数量name值
</p>
<p><img loading="lazy" decoding="async" width="1060" height="504" src="/wp-content/uploads/2018/05/word-image-3885.png" class="wp-image-4350" srcset="/wp-content/uploads/2018/05/word-image-3885.png 1060w, /wp-content/uploads/2018/05/word-image-3885-300x143.png 300w, /wp-content/uploads/2018/05/word-image-3885-768x365.png 768w, /wp-content/uploads/2018/05/word-image-3885-1024x487.png 1024w" sizes="(max-width: 1060px) 100vw, 1060px" /></p>
<p>
  ④增加隐藏域实现商品标识提交
</p>
<p><img loading="lazy" decoding="async" width="1057" height="473" src="/wp-content/uploads/2018/05/word-image-3886.png" class="wp-image-4351" srcset="/wp-content/uploads/2018/05/word-image-3886.png 1057w, /wp-content/uploads/2018/05/word-image-3886-300x134.png 300w, /wp-content/uploads/2018/05/word-image-3886-768x344.png 768w, /wp-content/uploads/2018/05/word-image-3886-1024x458.png 1024w" sizes="(max-width: 1057px) 100vw, 1057px" /></p>
<p>
  ⑤修改模板实现属性值的id提交
</p>
<p><img loading="lazy" decoding="async" width="1129" height="492" src="/wp-content/uploads/2018/05/word-image-3887.png" class="wp-image-4352" srcset="/wp-content/uploads/2018/05/word-image-3887.png 1129w, /wp-content/uploads/2018/05/word-image-3887-300x131.png 300w, /wp-content/uploads/2018/05/word-image-3887-768x335.png 768w, /wp-content/uploads/2018/05/word-image-3887-1024x446.png 1024w" sizes="(max-width: 1129px) 100vw, 1129px" /></p>
<p>
  提交接受数据发现只有一个属性值ID提交
</p>
<p><img loading="lazy" decoding="async" width="447" height="166" src="/wp-content/uploads/2018/05/word-image-3888.png" class="wp-image-4353" srcset="/wp-content/uploads/2018/05/word-image-3888.png 447w, /wp-content/uploads/2018/05/word-image-3888-300x111.png 300w" sizes="(max-width: 447px) 100vw, 447px" /></p>
<p>
  由于需要有多个属性值ID因此需要设置为数组格式
</p>
<p><img loading="lazy" decoding="async" width="1115" height="532" src="/wp-content/uploads/2018/05/word-image-3889.png" class="wp-image-4354" srcset="/wp-content/uploads/2018/05/word-image-3889.png 1115w, /wp-content/uploads/2018/05/word-image-3889-300x143.png 300w, /wp-content/uploads/2018/05/word-image-3889-768x366.png 768w, /wp-content/uploads/2018/05/word-image-3889-1024x489.png 1024w" sizes="(max-width: 1115px) 100vw, 1115px" /><br />
<img loading="lazy" decoding="async" width="767" height="321" src="/wp-content/uploads/2018/05/word-image-3890.png" class="wp-image-4355" srcset="/wp-content/uploads/2018/05/word-image-3890.png 767w, /wp-content/uploads/2018/05/word-image-3890-300x126.png 300w" sizes="(max-width: 767px) 100vw, 767px" /></p>
<p>
  由于单选属性使用的是radio类型。设置为数组格式多个单选属性只会提交一个。因此需要将属性相同的设置为一组
</p>
<p><img loading="lazy" decoding="async" width="1113" height="537" src="/wp-content/uploads/2018/05/word-image-3891.png" class="wp-image-4356" srcset="/wp-content/uploads/2018/05/word-image-3891.png 1113w, /wp-content/uploads/2018/05/word-image-3891-300x145.png 300w, /wp-content/uploads/2018/05/word-image-3891-768x371.png 768w, /wp-content/uploads/2018/05/word-image-3891-1024x494.png 1024w" sizes="(max-width: 1113px) 100vw, 1113px" /><br />
<img loading="lazy" decoding="async" width="767" height="295" src="/wp-content/uploads/2018/05/word-image-3892.png" class="wp-image-4357" srcset="/wp-content/uploads/2018/05/word-image-3892.png 767w, /wp-content/uploads/2018/05/word-image-3892-300x115.png 300w" sizes="(max-width: 767px) 100vw, 767px" /></p>
<p>
  ⑥修改方法实现商品添加购物车
</p>
<p><img loading="lazy" decoding="async" width="1188" height="697" src="/wp-content/uploads/2018/05/word-image-3893.png" class="wp-image-4358" srcset="/wp-content/uploads/2018/05/word-image-3893.png 1188w, /wp-content/uploads/2018/05/word-image-3893-300x176.png 300w, /wp-content/uploads/2018/05/word-image-3893-768x451.png 768w, /wp-content/uploads/2018/05/word-image-3893-1024x601.png 1024w" sizes="(max-width: 1188px) 100vw, 1188px" /></p>
<p>
  ⑦创建购物车模型
</p>
<p><img loading="lazy" decoding="async" width="1018" height="677" src="/wp-content/uploads/2018/05/word-image-3894.png" class="wp-image-4359" srcset="/wp-content/uploads/2018/05/word-image-3894.png 1018w, /wp-content/uploads/2018/05/word-image-3894-300x200.png 300w, /wp-content/uploads/2018/05/word-image-3894-768x511.png 768w" sizes="(max-width: 1018px) 100vw, 1018px" /></p>
<p>
  ⑧实现添加到购物车
</p>
</p>
<p><img loading="lazy" decoding="async" width="1086" height="706" src="/wp-content/uploads/2018/05/word-image-3895.png" class="wp-image-4360" srcset="/wp-content/uploads/2018/05/word-image-3895.png 1086w, /wp-content/uploads/2018/05/word-image-3895-300x195.png 300w, /wp-content/uploads/2018/05/word-image-3895-768x499.png 768w, /wp-content/uploads/2018/05/word-image-3895-1024x666.png 1024w" sizes="(max-width: 1086px) 100vw, 1086px" /><br />
<img loading="lazy" decoding="async" width="1051" height="544" src="/wp-content/uploads/2018/05/word-image-3896.png" class="wp-image-4361" srcset="/wp-content/uploads/2018/05/word-image-3896.png 1051w, /wp-content/uploads/2018/05/word-image-3896-300x155.png 300w, /wp-content/uploads/2018/05/word-image-3896-768x398.png 768w, /wp-content/uploads/2018/05/word-image-3896-1024x530.png 1024w" sizes="(max-width: 1051px) 100vw, 1051px" /><br />
<img loading="lazy" decoding="async" width="1042" height="449" src="/wp-content/uploads/2018/05/word-image-3897.png" class="wp-image-4362" srcset="/wp-content/uploads/2018/05/word-image-3897.png 1042w, /wp-content/uploads/2018/05/word-image-3897-300x129.png 300w, /wp-content/uploads/2018/05/word-image-3897-768x331.png 768w, /wp-content/uploads/2018/05/word-image-3897-1024x441.png 1024w" sizes="(max-width: 1042px) 100vw, 1042px" /></p>
<p>
  ⑨创建测试方法测试
</p>
<p><img loading="lazy" decoding="async" width="807" height="453" src="/wp-content/uploads/2018/05/word-image-3898.png" class="wp-image-4363" srcset="/wp-content/uploads/2018/05/word-image-3898.png 807w, /wp-content/uploads/2018/05/word-image-3898-300x168.png 300w, /wp-content/uploads/2018/05/word-image-3898-768x431.png 768w" sizes="(max-width: 807px) 100vw, 807px" /></p>
<p>
  没有登录加入购物车结果
</p>
<p><img loading="lazy" decoding="async" width="585" height="164" src="/wp-content/uploads/2018/05/word-image-3899.png" class="wp-image-4364" srcset="/wp-content/uploads/2018/05/word-image-3899.png 585w, /wp-content/uploads/2018/05/word-image-3899-300x84.png 300w" sizes="(max-width: 585px) 100vw, 585px" /></p>
<p>
  ⑩测试已经登录的用户
</p>
<p><img loading="lazy" decoding="async" width="950" height="430" src="/wp-content/uploads/2018/05/word-image-3900.png" class="wp-image-4365" srcset="/wp-content/uploads/2018/05/word-image-3900.png 950w, /wp-content/uploads/2018/05/word-image-3900-300x136.png 300w, /wp-content/uploads/2018/05/word-image-3900-768x348.png 768w" sizes="(max-width: 950px) 100vw, 950px" /></p>
<h2>3.4、购物车列表显示</h2>
<p>
  ①创建index方法
</p>
<p><img loading="lazy" decoding="async" width="1025" height="474" src="/wp-content/uploads/2018/05/word-image-3901.png" class="wp-image-4366" srcset="/wp-content/uploads/2018/05/word-image-3901.png 1025w, /wp-content/uploads/2018/05/word-image-3901-300x139.png 300w, /wp-content/uploads/2018/05/word-image-3901-768x355.png 768w, /wp-content/uploads/2018/05/word-image-3901-1024x474.png 1024w" sizes="(max-width: 1025px) 100vw, 1025px" /></p>
<p>
  ②在模型中定义getList方法
</p>
<p><img loading="lazy" decoding="async" width="869" height="422" src="/wp-content/uploads/2018/05/word-image-3902.png" class="wp-image-4367" srcset="/wp-content/uploads/2018/05/word-image-3902.png 869w, /wp-content/uploads/2018/05/word-image-3902-300x146.png 300w, /wp-content/uploads/2018/05/word-image-3902-768x373.png 768w" sizes="(max-width: 869px) 100vw, 869px" /></p>
<p>
  ③拷贝购物车列表模板
</p>
<p><img loading="lazy" decoding="async" width="1133" height="618" src="/wp-content/uploads/2018/05/word-image-3903.png" class="wp-image-4368" srcset="/wp-content/uploads/2018/05/word-image-3903.png 1133w, /wp-content/uploads/2018/05/word-image-3903-300x164.png 300w, /wp-content/uploads/2018/05/word-image-3903-768x419.png 768w, /wp-content/uploads/2018/05/word-image-3903-1024x559.png 1024w" sizes="(max-width: 1133px) 100vw, 1133px" /></p>
<p>
  ④修改模板资源地址
</p>
<p><img loading="lazy" decoding="async" width="1066" height="661" src="/wp-content/uploads/2018/05/word-image-3904.png" class="wp-image-4369" srcset="/wp-content/uploads/2018/05/word-image-3904.png 1066w, /wp-content/uploads/2018/05/word-image-3904-300x186.png 300w, /wp-content/uploads/2018/05/word-image-3904-768x476.png 768w, /wp-content/uploads/2018/05/word-image-3904-1024x635.png 1024w" sizes="(max-width: 1066px) 100vw, 1066px" /></p>
<p>
  ⑤修改getlist方法获取购物车中数据
</p>
<p><img loading="lazy" decoding="async" width="1076" height="696" src="/wp-content/uploads/2018/05/word-image-3905.png" class="wp-image-4370" srcset="/wp-content/uploads/2018/05/word-image-3905.png 1076w, /wp-content/uploads/2018/05/word-image-3905-300x194.png 300w, /wp-content/uploads/2018/05/word-image-3905-768x497.png 768w, /wp-content/uploads/2018/05/word-image-3905-1024x662.png 1024w" sizes="(max-width: 1076px) 100vw, 1076px" /></p>
<p>
  没有登录的结果
</p>
<p><img loading="lazy" decoding="async" width="674" height="161" src="/wp-content/uploads/2018/05/word-image-3906.png" class="wp-image-4371" srcset="/wp-content/uploads/2018/05/word-image-3906.png 674w, /wp-content/uploads/2018/05/word-image-3906-300x72.png 300w" sizes="(max-width: 674px) 100vw, 674px" /></p>
<p>
  已经登录的结构
</p>
<p><img loading="lazy" decoding="async" width="457" height="209" src="/wp-content/uploads/2018/05/word-image-3907.png" class="wp-image-4372" srcset="/wp-content/uploads/2018/05/word-image-3907.png 457w, /wp-content/uploads/2018/05/word-image-3907-300x137.png 300w" sizes="(max-width: 457px) 100vw, 457px" /></p>
<p>
  ⑥修改getList方法获取商品信息及属性信息
</p>
<p><img loading="lazy" decoding="async" width="1077" height="650" src="/wp-content/uploads/2018/05/word-image-3908.png" class="wp-image-4373" srcset="/wp-content/uploads/2018/05/word-image-3908.png 1077w, /wp-content/uploads/2018/05/word-image-3908-300x181.png 300w, /wp-content/uploads/2018/05/word-image-3908-768x464.png 768w, /wp-content/uploads/2018/05/word-image-3908-1024x618.png 1024w" sizes="(max-width: 1077px) 100vw, 1077px" /></p>
<p>
  已经登录结果
</p>
<p><img loading="lazy" decoding="async" width="832" height="559" src="/wp-content/uploads/2018/05/word-image-3909.png" class="wp-image-4374" srcset="/wp-content/uploads/2018/05/word-image-3909.png 832w, /wp-content/uploads/2018/05/word-image-3909-300x202.png 300w, /wp-content/uploads/2018/05/word-image-3909-768x516.png 768w" sizes="(max-width: 832px) 100vw, 832px" /></p>
<p>
  没有登录
</p>
<p><img loading="lazy" decoding="async" width="812" height="481" src="/wp-content/uploads/2018/05/word-image-3910.png" class="wp-image-4375" srcset="/wp-content/uploads/2018/05/word-image-3910.png 812w, /wp-content/uploads/2018/05/word-image-3910-300x178.png 300w, /wp-content/uploads/2018/05/word-image-3910-768x455.png 768w" sizes="(max-width: 812px) 100vw, 812px" /></p>
<p>
  ⑦模板显示
</p>
<p><img loading="lazy" decoding="async" width="1082" height="701" src="/wp-content/uploads/2018/05/word-image-3911.png" class="wp-image-4376" srcset="/wp-content/uploads/2018/05/word-image-3911.png 1082w, /wp-content/uploads/2018/05/word-image-3911-300x194.png 300w, /wp-content/uploads/2018/05/word-image-3911-768x498.png 768w, /wp-content/uploads/2018/05/word-image-3911-1024x663.png 1024w" sizes="(max-width: 1082px) 100vw, 1082px" /></p>
<p>
  ⑧控制器调用方法计算出总金额
</p>
<p><img loading="lazy" decoding="async" width="909" height="607" src="/wp-content/uploads/2018/05/word-image-3912.png" class="wp-image-4377" srcset="/wp-content/uploads/2018/05/word-image-3912.png 909w, /wp-content/uploads/2018/05/word-image-3912-300x200.png 300w, /wp-content/uploads/2018/05/word-image-3912-768x513.png 768w" sizes="(max-width: 909px) 100vw, 909px" /></p>
<p>
  ⑨创建模型方法计算总金额
</p>
<p><img loading="lazy" decoding="async" width="1009" height="663" src="/wp-content/uploads/2018/05/word-image-3913.png" class="wp-image-4378" srcset="/wp-content/uploads/2018/05/word-image-3913.png 1009w, /wp-content/uploads/2018/05/word-image-3913-300x197.png 300w, /wp-content/uploads/2018/05/word-image-3913-768x505.png 768w" sizes="(max-width: 1009px) 100vw, 1009px" /></p>
<h2>3.5、删除购物车</h2>
<p>
  ①修改模板设置删除的连接地址
</p>
<p><img loading="lazy" decoding="async" width="1105" height="389" src="/wp-content/uploads/2018/05/word-image-3914.png" class="wp-image-4379" srcset="/wp-content/uploads/2018/05/word-image-3914.png 1105w, /wp-content/uploads/2018/05/word-image-3914-300x106.png 300w, /wp-content/uploads/2018/05/word-image-3914-768x270.png 768w, /wp-content/uploads/2018/05/word-image-3914-1024x360.png 1024w" sizes="(max-width: 1105px) 100vw, 1105px" /></p>
<p>
  ②创建方法调用模型方法实现删除
</p>
<p><img loading="lazy" decoding="async" width="897" height="439" src="/wp-content/uploads/2018/05/word-image-3915.png" class="wp-image-4380" srcset="/wp-content/uploads/2018/05/word-image-3915.png 897w, /wp-content/uploads/2018/05/word-image-3915-300x147.png 300w, /wp-content/uploads/2018/05/word-image-3915-768x376.png 768w" sizes="(max-width: 897px) 100vw, 897px" /></p>
<p>
  ③创建模型方法实现删除
</p>
<p><img loading="lazy" decoding="async" width="1040" height="695" src="/wp-content/uploads/2018/05/word-image-3916.png" class="wp-image-4381" srcset="/wp-content/uploads/2018/05/word-image-3916.png 1040w, /wp-content/uploads/2018/05/word-image-3916-300x200.png 300w, /wp-content/uploads/2018/05/word-image-3916-768x513.png 768w, /wp-content/uploads/2018/05/word-image-3916-1024x684.png 1024w" sizes="(max-width: 1040px) 100vw, 1040px" /></p>
<h2>3.6、清空购物车</h2>
<p>
  ①增加清空购物车连接地址
</p>
<p><img loading="lazy" decoding="async" width="1053" height="433" src="/wp-content/uploads/2018/05/word-image-3917.png" class="wp-image-4382" srcset="/wp-content/uploads/2018/05/word-image-3917.png 1053w, /wp-content/uploads/2018/05/word-image-3917-300x123.png 300w, /wp-content/uploads/2018/05/word-image-3917-768x316.png 768w, /wp-content/uploads/2018/05/word-image-3917-1024x421.png 1024w" sizes="(max-width: 1053px) 100vw, 1053px" /></p>
<p>
  ②创建方法实现清空
</p>
<p><img loading="lazy" decoding="async" width="948" height="348" src="/wp-content/uploads/2018/05/word-image-3918.png" class="wp-image-4383" srcset="/wp-content/uploads/2018/05/word-image-3918.png 948w, /wp-content/uploads/2018/05/word-image-3918-300x110.png 300w, /wp-content/uploads/2018/05/word-image-3918-768x282.png 768w" sizes="(max-width: 948px) 100vw, 948px" /></p>
<p>
  ③在模型中创建方法
</p>
<p><img loading="lazy" decoding="async" width="1062" height="456" src="/wp-content/uploads/2018/05/word-image-3919.png" class="wp-image-4384" srcset="/wp-content/uploads/2018/05/word-image-3919.png 1062w, /wp-content/uploads/2018/05/word-image-3919-300x129.png 300w, /wp-content/uploads/2018/05/word-image-3919-768x330.png 768w, /wp-content/uploads/2018/05/word-image-3919-1024x440.png 1024w" sizes="(max-width: 1062px) 100vw, 1062px" /></p>
<h2>3.7、实现登录之后购物车数据转移</h2>
<p>
  ①创建转移的模型方法
</p>
<p><img loading="lazy" decoding="async" width="1035" height="671" src="/wp-content/uploads/2018/05/word-image-3920.png" class="wp-image-4385" srcset="/wp-content/uploads/2018/05/word-image-3920.png 1035w, /wp-content/uploads/2018/05/word-image-3920-300x194.png 300w, /wp-content/uploads/2018/05/word-image-3920-768x498.png 768w, /wp-content/uploads/2018/05/word-image-3920-1024x664.png 1024w" sizes="(max-width: 1035px) 100vw, 1035px" /><br />
<img loading="lazy" decoding="async" width="1052" height="356" src="/wp-content/uploads/2018/05/word-image-3921.png" class="wp-image-4386" srcset="/wp-content/uploads/2018/05/word-image-3921.png 1052w, /wp-content/uploads/2018/05/word-image-3921-300x102.png 300w, /wp-content/uploads/2018/05/word-image-3921-768x260.png 768w, /wp-content/uploads/2018/05/word-image-3921-1024x347.png 1024w" sizes="(max-width: 1052px) 100vw, 1052px" /></p>
<p>
  ②在登录完成之后触发转移
</p>
<p><img loading="lazy" decoding="async" width="986" height="522" src="/wp-content/uploads/2018/05/word-image-3922.png" class="wp-image-4387" srcset="/wp-content/uploads/2018/05/word-image-3922.png 986w, /wp-content/uploads/2018/05/word-image-3922-300x159.png 300w, /wp-content/uploads/2018/05/word-image-3922-768x407.png 768w" sizes="(max-width: 986px) 100vw, 986px" /></p>
]]></content:encoded>
					
					<wfw:commentRss>/%e5%90%8e%e5%8f%b0%e6%a1%86%e6%9e%b6/4315.html/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
