VSelect - Select가 Vuetify 3의 사용자 정의 '프로젝트' 슬롯에서 작동하지 않습니다.

Question

Vue 3 애플리케이션에서 Vuetify 3의 VSelect를 사용하고 있으며 항목 슬롯을 사용하려고 합니다. 그런데 VSelect 옵션을 선택할 수 없게 되었습니다

다음 VSelect 요소가 있습니다:

<v-select
    v-model="태그"
    :items="태그"
    변형="솔로"
    label="태그" >
    <템플릿 #item="{ 항목 }"
      <v-목록>
        <v-list-item :title="item.title"
      </v-list>
    </템플릿>
  </v-select>

데이터의 태그 및 태그:

태그: null,
  태그: [
    { 제목: '예제1', 값: 0 },
    { 제목: '예제2', 값: 1 },
  ],

출력에서 옵션이 있는 옵션을 선택했는데 옵션을 선택할 수 없습니다.

그렇다면 Vuetify 3의 VSelect 구성 요소에 대해 선택 가능한 옵션을 사용하여 슬롯 "항목"을 설정하는 방법은 무엇입니까?

Answer 1

슬롯에 전달된 props 对象包含一个 onClick 콜백은 선택 항목이 작동하도록 바인딩해야 합니다.

으아악

Documentation은 현재 약간 드물며, 제공된 유형은 Record。在 Vuetify 3.4 中，其他值是 key、title、value 和 ref(기본 템플릿 참조)입니다. VVritualScroll은 스크롤 막대의 높이를 업데이트하는 데 사용됩니다.

제목 속성이 있는 구성 요소를 사용하는 경우(예: VListItemtitle 属性的组件时（例如 VListItem），您可以绑定整个 props), 전체 props 객체를 바인딩할 수 있습니다:

으아악

(그런데 #item 插槽已将其内容渲染到 v-list 미디엄, 재포장 필요없음)

클립은 다음과 같습니다:

으아악 으아악