Блог

Главная - Вопросы по программированию - Переключение значков на v-expansion-panel-header при его открытии

Переключение значков на v-expansion-panel-header при его открытии

#c# #vuetify.js

#c# #vuetify.js

Вопрос:

Попытка подделать эффект переключателя, переключаясь между двумя значками и v-expansion-panel

до сих пор я заменил значок расширения на пользовательский.. но как я могу программно переключать значки всякий раз, когда я нажимаю заголовок расширения?

 <v-expansion-panel>
   <v-expansion-panel-header>
     <template v-slot:actions>
        <l-icon color="primary">
          radio-on
        </l-icon>
     </template>
       {{ data.text}}
    <v-expansion-panel-header>
</v-expansion-panel-header>

Ответ №1:

Я обнаружил, что это лучший вариант, чем просто замена значков

 <v-radio-group v-model="selectedItem">
              <v-expansion-panels left>
                <v-expansion-panel>
                  <v-expansion-panel-header hide-actions>
                    <v-radio value="1" label="First"></v-radio>
                  </v-expansion-panel-header>
                  <v-expansion-panel-content />
                </v-expansion-panel>
                <v-expansion-panel>
                  <v-expansion-panel-header hide-actions>
                    <v-radio value="2" label="Second"></v-radio>
                  </v-expansion-panel-header>
                  <v-expansion-panel-content />
                </v-expansion-panel>
              </v-expansion-panels>
            </v-radio-group>
Метки: