1717 <li
1818 class =" filter-dropdown-option"
1919 v-for =" category in categoryList"
20- :key =" category.id "
20+ :key =" category.mainCategoryId "
2121 :class ="
22- (main as number[]).includes(category.id )
22+ (main as number[]).includes(category.mainCategoryId )
2323 ? 'bg-primary1 text-white font-bold'
2424 : 'hover:bg-background-2'
2525 "
5858 <li
5959 class =" filter-dropdown-option"
6060 v-for =" subCategory in category.subCategory"
61- :key =" subCategory.id "
61+ :key =" subCategory.subCategoryId "
6262 :class ="
63- (sub as number[]).includes(subCategory.id )
63+ (sub as number[]).includes(subCategory.subCategoryId )
6464 ? 'bg-primary1 text-white font-bold'
6565 : 'hover:bg-background-2'
6666 "
67- @click =" () => onSubClick(subCategory.id )" >
67+ @click =" () => onSubClick(subCategory.subCategoryId )" >
6868 {{ subCategory.name }}
6969 </li >
7070 </ul >
7676
7777<script setup lang="ts">
7878import { dropdownIcon } from ' @/constants/iconPath'
79- import type { Category , FilterCategoryProps } from ' @/types/common'
79+ import type { Category , FilterCategoryProps , SubCategory } from ' @/types/common'
8080import { computed , ref , watchEffect } from ' vue'
8181import CommonIcons from ' ../common/CommonIcons.vue'
8282import { useOutsideClick } from ' @/hooks/useOutsideClick'
@@ -91,7 +91,7 @@ const toggleDropdown = (type: 'main' | 'sub') =>
9191 ? (isMainOpened .value = ! isMainOpened .value )
9292 : (isSubOpened .value = ! isSubOpened .value )
9393
94- const selectedCategoryList = ref <{ name: string ; subCategory: Category [] }[]>([])
94+ const selectedCategoryList = ref <{ name: string ; subCategory: SubCategory [] }[]>([])
9595const isDisabled = computed (() => {
9696 return selectedCategoryList .value .length === 0
9797})
@@ -106,8 +106,8 @@ const onMainClick = (category: Category) => {
106106 )
107107 if (category .subCategory ) {
108108 category .subCategory .forEach (el => {
109- if ((sub as number []).includes (el .id )) {
110- emit (' update:sub' , el .id )
109+ if ((sub as number []).includes (el .subCategoryId )) {
110+ emit (' update:sub' , el .subCategoryId )
111111 }
112112 })
113113 }
@@ -119,7 +119,7 @@ const onMainClick = (category: Category) => {
119119 })
120120 }
121121 }
122- emit (' update:main' , category .id )
122+ emit (' update:main' , category .mainCategoryId )
123123}
124124const onSubClick = (value : number ) => {
125125 emit (' update:sub' , value )
0 commit comments