# 起步：MVC模式
ThinkPHP 6.0 支持傳統的MVC（Model-View-Controller）模式以及流行的MVVM（Model-View-ViewModel）模式的應用開發
* * *
## ThinkPHP6 起步
* ThinkPHP支持傳統的MVC（`Model-View-Controller`）模式以及流行的MVVM（`Model-View-ViewModel`）模式的應用開發
## 一、MVC
* MVC 軟件系統分為三個基本部分：模型（`Model`）、視圖（`View`）和控制器（`Controller`）
* ThinkPHP 是一個典型的 MVC 架構
> 控制器 - 負責轉發請求，對請求進行處理。
>
> 視圖 - 界面設計人員進行圖形界面設計。
>
> 模型 - 程序員編寫程序應有的功能（實現算法等等）、數據庫專家進行數據管理和數據庫設計(可以實現具體的功能)。
## 二、單應用模式訪問
* 項目訪問路徑：www.xxx.com/index.php/index/index
index.php 入口文件
index 控制器
index 操作
> ├─app? ? ? ? ? ?應用目錄
>
> │? ├─controller? ? ? 控制器目錄
>
> │? ├─model? ? ? ? ? ?模型目錄
>
> │? ├─ ...? ? ? ? ? ? 更多類庫目錄
>
> │? │
>
> │? ├─common.php? ? ? ? ?公共函數文件
>
> │? └─event.php? ? ? ? ? 事件定義文件
>
> │
>
> ├─config? ? ? ? ? ? ? ? 配置目錄
>
> │? ├─app.php? ? ? ? ? ? 應用配置
>
> │? ├─cache.php? ? ? ? ? 緩存配置
>
> │? ├─console.php? ? ? ? 控制臺配置
>
> │? ├─cookie.php? ? ? ? ?Cookie配置
>
> │? ├─database.php? ? ? ?數據庫配置
>
> │? ├─filesystem.php? ? ?文件磁盤配置
>
> │? ├─lang.php? ? ? ? ? ?多語言配置
>
> │? ├─log.php? ? ? ? ? ? 日志配置
>
> │? ├─middleware.php? ? ?中間件配置
>
> │? ├─route.php? ? ? ? ? URL和路由配置
>
> │? ├─session.php? ? ? ? Session配置
>
> │? ├─trace.php? ? ? ? ? Trace配置
>
> │? └─view.php? ? ? ? ? ?視圖配置
>
> │
>
> ├─view? ? ? ? ? ? 視圖目錄
>
> ├─route? ? ? ? ? ? ? ? ?路由定義目錄
>
> │? ├─route.php? ? ? ? ? 路由定義文件
>
> │? └─ ...
>
> │
>
> ├─public? ? ? ? ? ? ? ? WEB目錄（對外訪問目錄）
>
> │? ├─index.php? ? ? ? ? 入口文件
>
> │? ├─router.php? ? ? ? ?快速測試文件
>
> │? └─.htaccess? ? ? ? ? 用于apache的重寫
>
> │
>
> ├─extend? ? ? ? ? ? ? ? 擴展類庫目錄
>
> ├─runtime? ? ? ? ? ? ? ?應用的運行時目錄（可寫，可定制）
>
> ├─vendor? ? ? ? ? ? ? ? Composer類庫目錄
>
> ├─.example.env? ? ? ? ? 環境變量示例文件
>
> ├─composer.json? ? ? ? ?composer 定義文件
>
> ├─LICENSE.txt? ? ? ? ? ?授權說明文件
>
> ├─README.md? ? ? ? ? ? ?README 文件
>
> ├─think? ? ? ? ? ? ? ? ?命令行入口文件
## 三、安裝視圖
* 視圖功能由`\think\View類`配合視圖驅動（也即模板引擎驅動）類一起完成，新版僅內置了PHP原生模板引擎（主要用于內置的異常頁面輸出），如果需要使用其它的模板引擎需要單獨安裝相應的模板引擎擴展
ThinkPHP6已獨立出一套模版，命名為：ThinkTemplate模板引擎；
使用think-template模板引擎，需安裝think-view；
> composer require topthink/think-view
* 視圖目錄可以在根目錄，也可以在app應用目錄
## 四、模版渲染
* 要使用View，必須先引入`think\facade\View`門面類
* fetch 方法渲染頁面
參數：靜態頁面的路徑，默認對應的靜態頁面
controller代碼
> <?php
>
> namespace app\\controller;
>
> use think\\facade\\View;
>
> class Index{
>
> ? ? public function index(){
>
> ? ? ? ? return View::fetch();
>
> ? ? }
>
> }
view代碼
備：Index類對應view下面的目錄
備：index方法對應view下面的目錄里的靜態文件
## 五、模版變量
* assign 方法賦值屬于全局變量賦值
* 模版輸出 {$name}
controller代碼
> namespace app\\controller;
>
> use think\\facade\\View;
>
> class Index{
>
> ? ? public function index(){
>
> ? ? ? ? // 模板變量賦值
>
> ? ? ? ? View::assign('name','歐陽克');
>
> ? ? ? ? View::assign('email','oyk@php.cn');
>
> ? ? ? ? // 或者批量賦值
>
> ? ? ? ? View::assign(\[
>
> ? ? ? ? ? ? 'name'? => '歐陽克',
>
> ? ? ? ? ? ? 'email' => 'oyk@php.cn'
>
> ? ? ? ? \]);
>
> ? ? ? ? // 模板輸出
>
> ? ? ? ? return View::fetch();
>
> ? ? }
>
> }
view代碼
>
>
>
>
>
>
> ? ?
>
> ? ? ThinkPHP6
>
>
>
>
>
> ? ? 姓名：{$name}
>
> ? ?
>
> ? ? 郵箱：{$email}
>
>
>
>
## 六、入口
* public目錄為唯一的web可訪問目錄
* 把資源文件放到`public/static`中
* 入口文件，默認為index.php
## 七、示例
* 把html頁面放到ThinkPHP框架里
* 此頁面是靜態文件
>
>
>
>
>
>
> ? ? 列表頁
>
> ? ?
>
> ? ?
>
> ? ?
>
> ? ? ? ? .header{width:100%;height: 50px;line-height: 50px;background: #2e6da4;color:#ffffff;}
>
> ? ? ? ? .title{margin-left: 20px;font-size: 20px;}
>
> ? ? ? ? .userinfo{float: right;margin-right: 10px;}
>
> ? ? ? ? .userinfo a{color:#ffffff;}
>
> ? ? ? ? .menu{width: 200px;background:#333744;position:absolute;}
>
> ? ? ? ? .main{position: absolute;left:200px;right:0px;}
>
>
>
> ? ? ? ? .layui-collapse{border: none;}
>
> ? ? ? ? .layui-colla-item{border-top:none;}
>
> ? ? ? ? .layui-colla-title{background:#42485b;color:#ffffff;}
>
> ? ? ? ? .layui-colla-content{border-top:none;padding:0px;}
>
>
>
> ? ? ? ? .content span{background: #009688;margin-left: 30px;padding: 10px;color:#ffffff;}
>
> ? ? ? ? .content div{border-bottom: solid 2px #009688;margin-top: 8px;}
>
> ? ? ? ? .content button{float: right;margin-top: -5px;}
>
> ? ?
>
>
>
>
>
> ? ?
>
> ? ? ? ? XXX--后臺管理系統
>
> ? ? ? ? 【歐陽克】退出
>
> ? ?
>
> ? ?
>
> ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? 商城管理
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? ? ? 商品列表
>
> ? ? ? ? ? ? ? ? ? ? ? ? 商品列表
>
> ? ? ? ? ? ? ? ? ? ? ? ? 商品列表
>
> ? ? ? ? ? ? ? ? ? ? ? ? 商品列表
>
> ? ? ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? 商城管理
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? ? ? 商品列表
>
> ? ? ? ? ? ? ? ? ? ? ? ? 商品列表
>
> ? ? ? ? ? ? ? ? ? ? ? ? 商品列表
>
> ? ? ? ? ? ? ? ? ? ? ? ? 商品列表
>
> ? ? ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? 商城管理
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? ? ? 商品列表
>
> ? ? ? ? ? ? ? ? ? ? ? ? 商品列表
>
> ? ? ? ? ? ? ? ? ? ? ? ? 商品列表
>
> ? ? ? ? ? ? ? ? ? ? ? ? 商品列表
>
> ? ? ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ?
>
> ? ?
>
> ? ?
>
> ? ? ? ?
>
> ? ? ? ? ? ? 商品列表
>
> ? ? ? ? ? ?
>
> ? ? ? ?
>
> ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? ID
>
> ? ? ? ? ? ? ? ? ? ? 商品標題
>
> ? ? ? ? ? ? ? ? ? ? 分類
>
> ? ? ? ? ? ? ? ? ? ? 價格
>
> ? ? ? ? ? ? ? ? ? ? 狀態
>
> ? ? ? ? ? ? ? ? ? ? 添加時間
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? 1
>
> ? ? ? ? ? ? ? ? ? ? 熙世界2019秋冬新款長袖杏色上衣連帽寬松刺繡文藝落肩袖加厚衛衣BF風
>
> ? ? ? ? ? ? ? ? ? ? 女裝
>
> ? ? ? ? ? ? ? ? ? ? 189
>
> ? ? ? ? ? ? ? ? ? ? 開啟
>
> ? ? ? ? ? ? ? ? ? ? 2019-12-12
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? 2
>
> ? ? ? ? ? ? ? ? ? ? 秋水伊人雙面呢冬裝2019年新款女裝氣質西裝領撞色羊毛大衣外套女
>
> ? ? ? ? ? ? ? ? ? ? 女裝
>
> ? ? ? ? ? ? ? ? ? ? 699
>
> ? ? ? ? ? ? ? ? ? ? 開啟
>
> ? ? ? ? ? ? ? ? ? ? 2019-12-12
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? 3
>
> ? ? ? ? ? ? ? ? ? ? 秋水伊人雙面呢冬裝2019年新款女裝氣質西裝領撞色羊毛大衣外套女
>
> ? ? ? ? ? ? ? ? ? ? 女裝
>
> ? ? ? ? ? ? ? ? ? ? 699
>
> ? ? ? ? ? ? ? ? ? ? 開啟
>
> ? ? ? ? ? ? ? ? ? ? 2019-12-12
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? 4
>
> ? ? ? ? ? ? ? ? ? ? 秋水伊人雙面呢冬裝2019年新款女裝氣質西裝領撞色羊毛大衣外套女
>
> ? ? ? ? ? ? ? ? ? ? 女裝
>
> ? ? ? ? ? ? ? ? ? ? 699
>
> ? ? ? ? ? ? ? ? ? ? 開啟
>
> ? ? ? ? ? ? ? ? ? ? 2019-12-12
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? 5
>
> ? ? ? ? ? ? ? ? ? ? 秋水伊人雙面呢冬裝2019年新款女裝氣質西裝領撞色羊毛大衣外套女
>
> ? ? ? ? ? ? ? ? ? ? 女裝
>
> ? ? ? ? ? ? ? ? ? ? 699
>
> ? ? ? ? ? ? ? ? ? ? 關閉
>
> ? ? ? ? ? ? ? ? ? ? 2019-12-12
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? 6
>
> ? ? ? ? ? ? ? ? ? ? 秋水伊人雙面呢冬裝2019年新款女裝氣質西裝領撞色羊毛大衣外套女
>
> ? ? ? ? ? ? ? ? ? ? 女裝
>
> ? ? ? ? ? ? ? ? ? ? 699
>
> ? ? ? ? ? ? ? ? ? ? 開啟
>
> ? ? ? ? ? ? ? ? ? ? 2019-12-12
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ?
>
> ? ?
>
>
>
>
>
>
>
> ? ? layui.use(\['element','layer','laypage'\], function(){
>
> ? ? ? ? var element = layui.element;
>
> ? ? ? ? var laypage = layui.laypage;
>
> ? ? ? ? $ = layui.jquery;
>
> ? ? ? ? layer = layui.layer;
>
> ? ? ? ? resetMenuHeight();
>
> ? ? });
>
> ? ? // 重新設置菜單容器高度
>
> ? ? function resetMenuHeight(){
>
> ? ? ? ? var height = document.documentElement.clientHeight - 50;
>
> ? ? ? ? $('#menu').height(height);
>
> ? ? }
>
>
controller代碼，此數據為測試數據，后面會從數據庫中讀取
> namespace app\\controller;
>
> use think\\facade\\View;
>
> class Index{
>
> ? ? public function index(){
>
> ? ? ? ? $title = '商城';
>
> ? ? ? ? $login = '歐陽克';
>
> ? ? ? ? $left = \[
>
> ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? 'title' => '商品管理',
>
> ? ? ? ? ? ? ? ? 'lists' => \[
>
> ? ? ? ? ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'id' => 1,
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'title' => '商品列表',
>
> ? ? ? ? ? ? ? ? ? ? \],
>
> ? ? ? ? ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'id' => 2,
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'title' => '商品分類',
>
> ? ? ? ? ? ? ? ? ? ? \]
>
> ? ? ? ? ? ? ? ? \]
>
> ? ? ? ? ? ? \],
>
> ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? 'title' => '用戶管理',
>
> ? ? ? ? ? ? ? ? 'lists' => \[
>
> ? ? ? ? ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'id' => 3,
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'title' => '用戶列表',
>
> ? ? ? ? ? ? ? ? ? ? \],
>
> ? ? ? ? ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'id' => 4,
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'title' => '購物車',
>
> ? ? ? ? ? ? ? ? ? ? \],
>
> ? ? ? ? ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'id' => 5,
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'title' => '用戶地址',
>
> ? ? ? ? ? ? ? ? ? ? \],
>
> ? ? ? ? ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'id' => 6,
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'title' => '訂單管理',
>
> ? ? ? ? ? ? ? ? ? ? \]
>
> ? ? ? ? ? ? ? ? \]
>
> ? ? ? ? ? ? \],
>
> ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? 'title' => '后臺管理',
>
> ? ? ? ? ? ? ? ? 'lists' => \[
>
> ? ? ? ? ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'id' => 7,
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'title' => '管理員列表',
>
> ? ? ? ? ? ? ? ? ? ? \],
>
> ? ? ? ? ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'id' => 8,
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'title' => '個人中心',
>
> ? ? ? ? ? ? ? ? ? ? \],
>
> ? ? ? ? ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'id' => 9,
>
> ? ? ? ? ? ? ? ? ? ? ? ? 'title' => '左側菜單列',
>
> ? ? ? ? ? ? ? ? ? ? \]
>
> ? ? ? ? ? ? ? ? \]
>
> ? ? ? ? ? ? \]
>
> ? ? ? ? \];
>
> ? ? ? ? $right = \[
>
> ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? 'id' => 1,
>
> ? ? ? ? ? ? ? ? 'title' => '熙世界2019秋冬新款長袖杏色上衣連帽寬松刺繡文藝落肩袖加厚衛衣BF風',
>
> ? ? ? ? ? ? ? ? 'cat' => '女裝',
>
> ? ? ? ? ? ? ? ? 'price' => 189,
>
> ? ? ? ? ? ? ? ? 'discount' => 6,
>
> ? ? ? ? ? ? ? ? 'status' => 1,
>
> ? ? ? ? ? ? ? ? // 'status' => '開啟',
>
> ? ? ? ? ? ? ? ? 'add\_time' => '2019-12-12',
>
> ? ? ? ? ? ? ? ? // 'add\_time' => '1576080000'
>
> ? ? ? ? ? ? \],
>
> ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? 'id' => 2,
>
> ? ? ? ? ? ? ? ? 'title' => '秋水伊人雙面呢冬裝2019年新款女裝氣質西裝領撞色羊毛大衣外套女',
>
> ? ? ? ? ? ? ? ? 'cat' => '女裝',
>
> ? ? ? ? ? ? ? ? 'price' => 699,
>
> ? ? ? ? ? ? ? ? 'discount' => 7,
>
> ? ? ? ? ? ? ? ? 'status' => 1,
>
> ? ? ? ? ? ? ? ? // 'status' => '開啟',
>
> ? ? ? ? ? ? ? ? 'add\_time' => '2019-12-12',
>
> ? ? ? ? ? ? ? ? // 'add\_time' => '1576080000'
>
> ? ? ? ? ? ? \],
>
> ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? 'id' => 3,
>
> ? ? ? ? ? ? ? ? 'title' => '微彈中高腰直腳牛仔褲男',
>
> ? ? ? ? ? ? ? ? 'cat' => '男裝',
>
> ? ? ? ? ? ? ? ? 'price' => 179,
>
> ? ? ? ? ? ? ? ? 'discount' => 8,
>
> ? ? ? ? ? ? ? ? 'status' => 2,
>
> ? ? ? ? ? ? ? ? // 'status' => '關閉',
>
> ? ? ? ? ? ? ? ? 'add\_time' => '2019-12-12',
>
> ? ? ? ? ? ? ? ? // 'add\_time' => '1576080000'
>
> ? ? ? ? ? ? \],
>
> ? ? ? ? ? ? \[
>
> ? ? ? ? ? ? ? ? 'id' => 1,
>
> ? ? ? ? ? ? ? ? 'title' => '男士長袖t恤秋季圓領黑白體恤T 純色上衣服打底衫',
>
> ? ? ? ? ? ? ? ? 'cat' => '男裝',
>
> ? ? ? ? ? ? ? ? 'price' => 99,
>
> ? ? ? ? ? ? ? ? 'discount' => 9,
>
> ? ? ? ? ? ? ? ? 'status' => 1,
>
> ? ? ? ? ? ? ? ? // 'status' => '開啟',
>
> ? ? ? ? ? ? ? ? 'add\_time' => '2019-12-12',
>
> ? ? ? ? ? ? ? ? // 'add\_time' => '1576080000'
>
> ? ? ? ? ? ? \],
>
> ? ? ? ? \];
>
> ? ? ? ? View::assign(\[
>
> ? ? ? ? ? ? 'title'? => $title,
>
> ? ? ? ? ? ? 'login' => $login,
>
> ? ? ? ? ? ? 'left' => $left,
>
> ? ? ? ? ? ? 'right' => $right
>
> ? ? ? ? \]);
>
> ? ? ? ? return View::fetch();
>
> ? ? }
>
> }
view代碼，控制器數據在視圖中使用
>
>
>
>
>
>
> ? ? {$title}--后臺管理系統
>
> ? ?
>
> ? ?
>
> ? ?
>
> ? ? ? ? .header{width:100%;height: 50px;line-height: 50px;background: #2e6da4;color:#ffffff;}
>
> ? ? ? ? .title{margin-left: 20px;font-size: 20px;}
>
> ? ? ? ? .userinfo{float: right;margin-right: 10px;}
>
> ? ? ? ? .userinfo a{color:#ffffff;}
>
> ? ? ? ? .menu{width: 200px;background:#333744;position:absolute;}
>
> ? ? ? ? .main{position: absolute;left:200px;right:0px;}
>
>
>
> ? ? ? ? .layui-collapse{border: none;}
>
> ? ? ? ? .layui-colla-item{border-top:none;}
>
> ? ? ? ? .layui-colla-title{background:#42485b;color:#ffffff;}
>
> ? ? ? ? .layui-colla-content{border-top:none;padding:0px;}
>
>
>
> ? ? ? ? .content span{background: #009688;margin-left: 30px;padding: 10px;color:#ffffff;}
>
> ? ? ? ? .content div{border-bottom: solid 2px #009688;margin-top: 8px;}
>
> ? ? ? ? .content button{float: right;margin-top: -5px;}
>
> ? ?
>
>
>
>
>
> ? ?
>
> ? ? ? ? {$title}--后臺管理系統
>
> ? ? ? ? 【{$login}】退出
>
> ? ?
>
> ? ?
>
> ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? {$left.0.title}
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? ? ? {$left.0.lists.0.title}
>
> ? ? ? ? ? ? ? ? ? ? ? ? {$left.0.lists.1.title}
>
> ? ? ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? {$left\[1\]\['title'\]}
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? ? ? {$left.1.lists.0.title}
>
> ? ? ? ? ? ? ? ? ? ? ? ? {$left.1.lists.1.title}
>
> ? ? ? ? ? ? ? ? ? ? ? ? {$left.1.lists.2.title}
>
> ? ? ? ? ? ? ? ? ? ? ? ? {$left.1.lists.3.title}
>
> ? ? ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? {$left.2.title}
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? ? ? {$left.2.lists.0.title}
>
> ? ? ? ? ? ? ? ? ? ? ? ? {$left.2.lists.1.title}
>
> ? ? ? ? ? ? ? ? ? ? ? ? {$left.2.lists.2.title}
>
> ? ? ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ?
>
> ? ?
>
> ? ?
>
> ? ? ? ?
>
> ? ? ? ? ? ? 商品列表
>
> ? ? ? ? ? ?
>
> ? ? ? ?
>
> ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? ID
>
> ? ? ? ? ? ? ? ? ? ? 商品標題
>
> ? ? ? ? ? ? ? ? ? ? 分類
>
> ? ? ? ? ? ? ? ? ? ? 價格
>
> ? ? ? ? ? ? ? ? ? ? 折扣
>
> ? ? ? ? ? ? ? ? ? ? 狀態
>
> ? ? ? ? ? ? ? ? ? ? 添加時間
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? {$right.0.id}
>
> ? ? ? ? ? ? ? ? ? ? {$right.0.title}
>
> ? ? ? ? ? ? ? ? ? ? {$right.0.cat}
>
> ? ? ? ? ? ? ? ? ? ? {$right.0.price}
>
> ? ? ? ? ? ? ? ? ? ? {$right.0.discount}
>
> ? ? ? ? ? ? ? ? ? ? {$right.0.status}
>
> ? ? ? ? ? ? ? ? ? ? {$right.0.add\_time}
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? {$right.1.id}
>
> ? ? ? ? ? ? ? ? ? ? {$right.1.title}
>
> ? ? ? ? ? ? ? ? ? ? {$right.1.cat}
>
> ? ? ? ? ? ? ? ? ? ? {$right.1.price}
>
> ? ? ? ? ? ? ? ? ? ? {$right.1.status}
>
> ? ? ? ? ? ? ? ? ? ? {$right.0.discount}
>
> ? ? ? ? ? ? ? ? ? ? {$right.1.add\_time}
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? {$right.2.id}
>
> ? ? ? ? ? ? ? ? ? ? {$right.2.title}
>
> ? ? ? ? ? ? ? ? ? ? {$right.2.cat}
>
> ? ? ? ? ? ? ? ? ? ? {$right.2.price}
>
> ? ? ? ? ? ? ? ? ? ? {$right.2.status}
>
> ? ? ? ? ? ? ? ? ? ? {$right.0.discount}
>
> ? ? ? ? ? ? ? ? ? ? {$right.2.add\_time}
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ? ? ? ? ? {$right.3.id}
>
> ? ? ? ? ? ? ? ? ? ? {$right.3.title}
>
> ? ? ? ? ? ? ? ? ? ? {$right.3.cat}
>
> ? ? ? ? ? ? ? ? ? ? {$right.3.price}
>
> ? ? ? ? ? ? ? ? ? ? {$right.3.status}
>
> ? ? ? ? ? ? ? ? ? ? {$right.0.discount}
>
> ? ? ? ? ? ? ? ? ? ? {$right.3.add\_time}
>
> ? ? ? ? ? ? ? ?
>
> ? ? ? ? ? ?
>
> ? ? ? ?
>
> ? ?
>
>
>
>
>
>
>
> ? ? layui.use(\['element','layer','laypage'\], function(){
>
> ? ? ? ? var element = layui.element;
>
> ? ? ? ? var laypage = layui.laypage;
>
> ? ? ? ? $ = layui.jquery;
>
> ? ? ? ? layer = layui.layer;
>
> ? ? ? ? resetMenuHeight();
>
> ? ? });
>
> ? ? // 重新設置菜單容器高度
>
> ? ? function resetMenuHeight(){
>
> ? ? ? ? var height = document.documentElement.clientHeight - 50;
>
> ? ? ? ? $('#menu').height(height);
>
> ? ? }
>
>
