vue一級分類和耳機分類 vue 無限級分類導航

2021-10-13 11:44:34 字數 993 閱讀 2444

遞迴元件,實現無限級分類導航

1、向後端請求資料,返回的資料結構長這樣子

2、對後端返回的資料進行整理,整理為我們想要的結構,整理後資料結構長這樣,如果有下級目錄就新增children

最後遞迴元件,頁面顯示結果

父元件html**

js**

data()

methods:else {

this.$router.push({

path:'/main/course/details',

query:{

courseid:courseid

.titlebackstyle {

background-color: #f2f2f2;

.groupborder{

border-bottom: 1px solid #e4e4e4;

.courseborder{

border-bottom: 1px solid #f2f2f2;

.titlestyle {

padding: 10px 0;

padding-right: 10px;

.clearfl::after {

display: block;

content: "";

clear: both;

.groupname {

background-color: #f2f2f2;

padding: 10px 12px;

border-bottom: 1px solid #e4e4e4;

font-size: 14px;

color: #515151;

.coursechild::after {

display: block;

content: "";

clear: both;

.title {

float: left;

.play {

float: right;

其他方法:

關於一級分類和二級分類

1.配置一級分類和二級分類的關聯關係 在一級分類creatgory中配置乙個set型別的二級分類的集合 因為要接收一組二級分類的資料 一級分類hbm.xml的配置是一對多 在二級分類creatgroysecond中配置一級分類的物件,hbm.xml中配置多對一 傳遞一級分類的id 執行乙個方法直接返...

一級分類和二級分類的要點

1.配置一級分類和二級分類的關聯關係 在一級分類creatgory中配置乙個set型別的二級分類的集合 因為要接收一組二級分類的資料 一級分類hbm.xml的配置是一對多 在二級分類creatgroysecond中配置一級分類的物件,hbm.xml中配置多對一 傳遞一級分類的id 執行乙個方法直接返...

vue高亮一級 二級導航

使用vue開發過程中有的專案會存在多級導航的情況,如下圖,這種就存在了兩層,那麼該如何高亮一級導航,又該如何高亮二級導航這就是今天我要記錄的內容。1 高亮一級導航很簡單,如下 點選一級導航 changefirstlevel index,e 2 高亮二級導航,如下 view部分 點選二級導航 chan...