專案中,會有乙個模組展示多個類別的資料,點某乙個標題只展示相關的內容。
="classifytoolbox"
>
="flexrowstart classify*******"
>
for=
"(item, index) in classifytooldata"
:key=
"index"
class
="classifytoolbtn"
:class
="[currentindex === index ? 'page-select' : '']"
@click
="clickfun(index)"
>
}<
/div>
<
/div>
="classifytoollistbody"
>
這裡是}的資料<
/div>
<
!-- 展示當前所選中分類標題對應的分類列表資料--
>
for=
"(item, index) in classifytoollist[currentindex]"
:key=
"index"
class=""
>
<
/div>
<
/div>
<
/div>
<
/div>
<
/template>
export default,,
,]// 模組分類的分頁查詢條件};
;// 預設查詢第乙個分類對應的列表資料if(
this
.classifytooldata.length >0)
);}}
});}
,// 2.查詢:分類型別對應的資料列表
篩選分類列表展示
接著昨天未完成的部分,下面接著實現,當篩選之後下面對應出現相關型別的內容。話不多說,先上效果圖。資料庫設計 文章表的sortid欄位關聯分類表的id,type id關聯type表字段。填充資料大致如下,如果不清楚sortid,和type id請移步至昨天我的另一篇部落格 php實現類似慕課網,php...
分類資料展示
category 分類的資料在每一次頁面載入後都會重新請求資料庫來載入,對資料庫的壓力比較大,而且分類的資料不會經常產生變化,所有可以使用redis來快取這個資料。前台 頁面載入事件 function function data var msg 歡迎回來,data.name span usernam...
Vue遞迴元件實現多級列表分類
資訊的分類展示 看到這種格式,我想好多人肯定會說,我可以使用v for的巢狀迴圈不就完事了。對,沒毛病這樣的話也可以做,但是如果資料又多加了 很多 級分類呢 使用v for也能實現,但是 量是不是太大了呢!也不適合後期的維護,這個時候呢,我們就可以使用我們所說道的 遞迴元件 了,使用遞迴元件,無論你...