您好,登錄后才能下訂單哦!
使用tp5框架怎么實現一個無限極導航菜單?很多新手對此不是很清楚,為了幫助大家解決這個難題,下面小編將為大家詳細講解,有這方面需求的人可以來學習下,希望你能有所收獲。
使用方法:
1、將最下面的代碼保存到“前臺”控制器目錄下(名為 FrontNav.php),比如(路徑): application/index/controll(應用/模塊/控制器)
2、在控制器中使用:(application/index/controll/index)(應用/模塊/控制器/方法)
也可以放到基礎類的初始化方法中,如:Base.php 的 _initialize() 方法(不用多解釋,這個是 tp5 的初始化方法 貌似 init() 也行?可以自己試試)
使用:
1)、第一步:先實例化本類, 5 個參數。
參數說明:
param 1:必填 字符串類型 數據表名稱(也是模型名稱),不用其實字母大寫也行。例如: category
param 2:選填 字符串類型 模型所在的路徑(默認是:admin模塊下的model目錄)。如果你不叫 admin,那么書寫格式如下:houtai/model
param 3:必填 字符串類型 父級欄目字段名稱,例如:pid(parent id)
param 4:選填 數組類型 默認是按 id 正序排序的,如果有排序字段 sortField 的值為 字段名稱 如 sort 或者 listorder 等…,sortOrder 的值為 asc(正序) 或 desc (倒序),建議按這個排序,要不然會顯示有點亂,因為權重的關系需要手動排序顯示的位置。
param 5:必填 二維數組 替換關鍵詞,該參數的第一個數組為頂部導航所需要替換的關鍵詞(必填),linkUrl(url 鏈接)是固定模式,必須這么寫,它的值是:模塊/控制器/方法,其他的鍵為要替換的關鍵詞值為字段名稱。第二個數組(選填)為二級菜單,第三個數組(選填)為N級菜單,此三個數組個數要對應 $this->createNavHtml() 方法中模版參數的個數,詳見 createNavHtml() 方法解釋。
$frontNav = new FrontNav('category', '', 'pid', array( 'sortField' => 'sort', 'sortOrder' => 'asc' ), array( array( 'linkUrl' => 'index/artlist/index', 'catName' => 'name', 'catDesc' => 'desc' ), array( 'linkUrl' => 'index/artlist/index', 'catName' => 'name', 'catDesc' => 'desc' ) ));
2)、第二步:生成 導航的 html 結構,4個參數
param 1:選填 字符串類型 首頁的 html 模版,例如 ‘<li><a class=”navi_home” href=”/”>首頁</a></li>'
param 2:必填 數組類型 頂部導航的 html 模版,注意下面實例的格式寫法
param 3:選填 數組類型 二級菜單的 html 模版,同上
param 4:選填 數組類型 N級菜單的 html 模版,同上
$navHtml = $frontNav->createNavHtml('<li><a class="navi_home" href="/" rel="external nofollow" rel="external nofollow" >首頁</a></li>', array( '<ul id="jsddm" class="topNav">', '<li><a href="linkUrl" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" title="catDesc">catName</a>', '</li>', '</ul>' ), array( '<ul class="twoLevel">', '<li><a href="linkUrl" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" title="catDesc">catName</a>', '</li>', '</ul>' ), '');
3)、第三步:向模版輸出
$this->assign(array( 'navHtml' => $navHtml ));
4)、第四步:模版調用(多余??)
<div id="navi"> {$navHtml} </div>
提示:
1、替換關鍵詞參數個數與模版(除了首頁外)參數個數一定要對應,打字解釋的可能有點不明白,詳細的對照 實例化 和 創鍵方法 的代碼看幾遍就明白了,實在不行可以看源程序,都有較詳細的注釋。
2、本類默認模型優先,如果沒有模型就會查表返回數據庫實例。
3、還有一點要注意就是你的替換關鍵詞盡量要跟模版里的字符串不要重復,比如說,你的替換關鍵詞叫 ‘id' => catename,而模版里 <li id=”xixixi”><a href=”###”>哎呀?</a></li>,要是這樣就壞了…
求高手改成php原生的,可聯系qq發給我嗎?嘿嘿…
具體哪有不清楚的可以聯系我QQ
效果圖:(好像也支持無限極菜單)
<?php /** * Created by PhpStorm. * User: Chao Chao * Date: 2017/9/23 * Time: 10:18 * versions: 1.0.0 * url: null * email: 2776332953@qq.com * phone: *** */ namespace app\index\controller; use think\Db; // 引用 Db (數據庫鏈接) 類 use think\Url; // 引用 Url ( 創建 url) 類 use think\Loader; // 引用 Loader ( 加載 ) 類 class FrontNav { // 數據庫實例 protected $db; // 無限極字段名稱 protected $pidName = ''; // 排序設置 protected $sort = array(); // 一級導航html模版 protected $levelOne = array(); // 二級導航html模版 protected $levelTwo = array(); // n級導航html模版 protected $levelN = array(); // nav html protected $navHtml = ''; // 替換關鍵詞 protected $replaceKeywords = array(); /** * FrontNav constructor. 構造方法用于生成數據實例與配置參數 * @param string $name 數據表名稱或模型名稱 * @param string $modelPath 模型所在路徑,默認為 admin/model (admin模塊下的model目錄) * @param string $pidName 無限極分類的字段(如:pid 或 parentid 等) * @param string $sort 要排序的字段名稱 * @param array $replaceKeywords 定義的替換關鍵詞 */ public function __construct($name, $modelPath, $pidName, $sort, $replaceKeywords) { // $name 為必填參數 if (empty($name) || !is_string($name)) { throw new \think\Exception('參數錯誤 $name(表名稱或模型名稱),實例化時該參數必須為字符串類型且不能為空!'); } // 模型優先考慮 如果 模型類先存在 就返回 模型實例,否則返回 Db 類實例。 // 防止大小寫錯誤,先都轉換成小寫在將第一個字母大寫 如:Category,因為 linux 區分大小寫 $fileName = ucwords(strtolower($name)); // 一般欄目的模型都在后臺,所以這里就寫死了地址 '/admin/model/',也可以傳參制定位置 $modelPath = !empty($modelPath) ? strtolower($modelPath) : 'admin/model'; if (class_exists('app\\' . str_replace('/', '\\', $modelPath) . '\\' . $fileName)) { $this->db = Loader::model($fileName, 'model', false, 'admin'); } else { // 不確定在 linux 下數據庫名稱是否區分大小寫,所以都轉換成小寫。 $this->db = Db::name(strtolower($fileName)); } // 無限極父類字段不能為空 if (!empty($pidName)) { $this->pidName = $pidName; } else { throw new \think\Exception('參數錯誤 $pidName(父欄目id),實例化時字段名稱不能為空!'); } // 替換關鍵詞 if (empty($replaceKeywords) || !is_array($replaceKeywords)) { throw new \think\Exception('參數錯誤 $replaceKeywords(替換關鍵詞),實例化時該參數必須是而為數組類型且不能為空!');; } else { $this->replaceKeywords = $replaceKeywords; } $this->sort = $sort; } /** * 控制器調用,生成導航菜單。頂層導航的樣式( 參數2 $levelOneTemplate )為必填項,也就是說最基本的是一層導航,二級和多級是選填項( 參數3: $levelTwoTemplate 與 參數4 $levelNTemplate 非必填項 ) * @param string $homePageHml 首頁 標簽的html樣式,如: <li><a class="navi_home" href="/" rel="external nofollow" rel="external nofollow" >首頁</a></li> * @param array $levelOneTemplate 必填 頂部導航的html樣式,如: array( * '<ul id="jsddm" class="topNav">', 最外層 ul * '<li><a href="linkUrl" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" title="catDesc">catName</a>', li標簽 * '</li>', li 結束 * '</ul>' ul 結束 * ) * @param array $levelTwoTemplate 選填 二級菜單的html樣式,如: array( * '<ul class="twoLevel">', 二級菜單的 ul * '<li><a href="linkUrl" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" title="catDesc">catName</a>', li標簽 * '</li>',li 結束 * '</ul>'ul 結束 * ) * @param array $levelNTemplate 選填 多級菜單的html樣式,如: array( * '<ul class="nLevel">', N級菜單的 ul * '<li><a href="linkUrl" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" title="catDesc">catName</a>', li標簽 * '</li>',li 結束 * '</ul>'ul 結束 * @return string */ public function createNavHtml($homePageHml, $levelOneTemplate, $levelTwoTemplate, $levelNTemplate) { // 第一層導航不能為空且必須是數組 if (empty($levelOneTemplate) || !is_array($levelOneTemplate)) { throw new \think\Exception('參數錯誤 $levelOneTemplate(一級導航模版),該參數必須是數組類型且不能為空!'); } $this->levelOne = $levelOneTemplate; // 二級導航 if (!empty($levelTwoTemplate) && !is_array($levelTwoTemplate)) { throw new \think\Exception('參數錯誤 $levelTwoTemplate(二級導航模版),該參數可以為空 \'\' 或 array(),否則必須是數組類型!'); } $this->levelTwo = $levelTwoTemplate; // N級導航 if (!empty($levelNTemplate) && !is_array($levelNTemplate)) { throw new \think\Exception('參數錯誤 $levelNTemplate(N級導航模版),該參數可以為空 \'\' 或 array(),否則必須是數組類型!'); } $this->levelN = $levelNTemplate; $treeData = $this->getTreeData($this->getAllData(), 0); //print_r($treeData); $this->createHtml($treeData); return $this->levelOne[0] . (!empty($homePageHml) ? $homePageHml : '') . $this->navHtml . $this->levelOne[3] . "\n"; } /** * 獲取所有數據 * @return array */ private function getAllData() { if (empty($this->sort) || empty($this->sort['sortField']) || empty($this->sort['sortOrder'])) { return collection($this->db->where(1) ->select())->toArray(); } else { return collection($this->db->where(1) ->order($this->sort['sortField'] . ' ' . $this->sort['sortOrder']) ->select())->toArray(); } } /** * 將所有數據攢成樹狀結構的數組 * 增加 levels (層級) children (子數組) * @param $allData 傳遞過來的所有非樹狀結構的數組 * @param $parentId 初始化時的父欄目id * @return array 樹狀結構的數組 */ private function getTreeData($allData, $parentId) { $tree = array(); // 層級計數 static $number = 1; foreach ($allData as $v) { if ($v[$this->pidName] == $parentId) { if ($v[$this->pidName] == 0) { $v['levels'] = 0; } else { $v['levels'] = $number; ++$number; } $v['children'] = $this->getTreeData($allData, $v['id']); $tree[] = $v; } else { $number = 1; } } return $tree; } /** * 遞歸生成樹狀結構的html * @param $allData array 由 createNavHtml() 方法傳遞過來的 樹形結構 數據(數組) * @return string 返回(最外層ul內部的html)樹狀結構的html */ private function createHtml($allData) { foreach ($allData as $v) { // 頂部導航 if ($v['levels'] == 0) { $tempStr0 = $this->levelOne[1]; foreach ($this->replaceKeywords[0] as $k1 => $v1) { if ($k1 == 'linkUrl') { $tempStr0 = str_replace($k1, Url::build($v1, 'id=' . $v['id']), "\n" . $tempStr0); } else { $tempStr0 = str_replace($k1, $v[$v1], $tempStr0); } } $this->navHtml .= $tempStr0; if (empty($v['children'])) { $this->navHtml .= $this->levelOne[2] . "\n"; } else if (!empty($v['children']) && !empty($this->levelTwo)) { $this->navHtml .= "\n" . $this->levelTwo[0] . "\n"; $this->createHtml($v['children']); $this->navHtml .= $this->levelTwo[3] . $this->levelOne[2]; } } // 二級菜單 if ($v['levels'] == 1) { $tempStr2 = $this->levelTwo[1]; foreach ($this->replaceKeywords[1] as $k1 => $v1) { if ($k1 == 'linkUrl') { $tempStr2 = str_replace($k1, Url::build($v1, 'id=' . $v['id']), $tempStr2); } else { $tempStr2 = str_replace($k1, $v[$v1], $tempStr2); } } $this->navHtml .= $tempStr2; if (empty($v['children'])) { $this->navHtml .= $this->levelTwo[2] . "\n"; } else if (!empty($v['children']) && !empty($this->levelN)) { // 是否多級導航,有 children ,還必須有3級 html 模版 $this->navHtml .= "\n" . $this->levelN[0] . "\n"; $this->createHtml($v['children']); $this->navHtml .= $this->levelN[3] . $this->levelTwo[2] . "\n"; } } // 多級菜單 if (!empty($this->levelN) && $v['levels'] > 1) { $tempStrN = $this->levelN[1]; foreach ($this->replaceKeywords[2] as $k1 => $v1) { if ($k1 == 'linkUrl') { $tempStrN = str_replace($k1, Url::build($v1, 'id=' . $v['id']), $tempStrN); } else { $tempStrN = str_replace($k1, $v[$v1], $tempStrN); } } $this->navHtml .= $tempStrN; if (empty($v['children'])) { $this->navHtml .= $this->levelN[2] . "\n"; } else { $this->navHtml .= $this->levelN[0]; $this->createHtml($v['children']); $this->navHtml .= $this->levelN[3] . $this->levelN[2]; } } } return $this->navHtml; } }
看完上述內容是否對您有幫助呢?如果還想對相關知識有進一步的了解或閱讀更多相關文章,請關注億速云行業資訊頻道,感謝您對億速云的支持。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。