Vue 체크박스를 선택 취소하면 Null이 반환됩니다.

Question

Vuetify를 사용하여 Vue 애플리케이션을 작성 중입니다. 이 애플리케이션에서는 v-for를 사용하여 객체 배열을 반복하여 카드 목록을 작성합니다. 각 카드 안에는 Vuex 스토어의 값을 업데이트하는 계산된 getter/setter에 매핑되는 확인란이 있습니다.

체크박스를 선택하면 값 등록이 취소되고 폴더 개체가 표시됩니다. 그러나 선택을 취소하면 값은 빈 배열입니다. 확인란을 선택 취소한 경우 폴더 개체를 setter에 푸시할 수 있는 방법이 있습니까? false 값을 사용해 보았지만 이를 폴더 개체에 바인딩할 수 있는 방법이 없는 것 같습니다.

다음은 카드의 논리입니다:

으아아아

설정 저장소에서 선택한 폴더를 처리하는 양방향 계산 속성은 다음과 같습니다.

<v-col v-for="folder in childFolders" :key="folder.id">
   <v-card class="mb-2 object-card">
      <v-list-item two-line class="two-line">
         <v-list-item-action>
            <v-checkbox v-model="selectedFolders" :ripple="false" :value="folder" />
         </v-list-item-action>
      </v-list-item>
   </v-card>
</v-col>

Answer 1

아, 체크박스의 즐거움... 실제로 POST 양식을 백엔드 코드로 보냈던 시절에는 POST 요청에 전송된 체크박스만 확인했습니다. 동적으로 생성된 경우 DOM에 어떤 항목이 있는지 알 수 없지만 확인하지는 않았습니다.

childFolders가 isSelected 속성을 갖도록 코드를 리팩터링하는 방법 그러면 할 수 있어요

해본 적은 없고 그냥 추측일 뿐입니다.