Корпус панели расширения Vuetify не имеет стиля отображения в среде тестирования

Question

Здравствуйте. В настоящее время у меня возникают проблемы при отладке проблемы на моем сайте тестирования, что произошло из-за того, что панели расширения не отображаются из-за какого-то атрибута style, прикрепленного к элементу div v-extension-panel__body .Это не происходит на моем местном.Оба выполняет npm run build при создании приложения.

Ниже приведены мои коды

Шаблон

<v-expansion-panel
                    light
                    class="elevation-0">
                    <v-expansion-panel-content
                        v-for="(acl, moduleIndex) in aclModuleAndActionItems"
                        :key="moduleIndex">
                        <template v-slot:header>
                            <div>
                                <h3>
                                    {{acl.module_name}}
                                </h3>
                            </div>
                        </template>
                        <v-card
                            flat 
                            class="elevation-0">
                            <v-card-text class="pa-0">
                                <div 
                                    v-for="(action, actionIndex) in acl.action_names" 
                                    :key="actionIndex">
                                    <div class="pl-5">
                                        <v-checkbox
                                            :disabled="!role"
                                            :label="action | underscoretospace"
                                            color="green"
                                            class="pt-2 pb-2 pl-5 pr-4"
                                            @change="validateAclRole($event, role, acl.module_name, action)">
                                        </v-checkbox>
                                    </div>
                                    <v-divider v-if="actionIndex < (acl.action_names.length - 1)"></v-divider>
                                </div>
                            </v-card-text>
                        </v-card>
                    </v-expansion-panel-content>
                </v-expansion-panel>

Сценарий

<script>
import { AclModuleAndActionItems } from '~/static/AclModuleAndActionItems.js'

export default {
    data() {
        return {
            aclModuleAndActionItems: ( AclModuleAndActionItems ) ? AclModuleAndActionItems : [],
            role: ''
        }
    }
}
</script>

Массив ACL

export const AclModuleAndActionItems =  [
    {
        "module_name": "acl",
        "action_names": [
            "create",
            "destroy",
            "edit",
            "index",
            "show",
            "store",
            "update"
        ]
    },
    {
        "module_name": "projects",
        "action_names": [
            "create",
            "destroy",
            "edit",
            "index",
            "show",
            "store",
            "update"
        ]
    },
    {
        "module_name": "tasks",
        "action_names": [
            "create",
            "destroy",
            "edit",
            "index",
            "pending_task",
            "show",
            "store",
            "update"
        ]
    }
]

Отображение на моем локальном

Answer 1

Завершено с использованием приведенного ниже кода для заголовков панели, и атрибут стиля больше не добавляется в заголовок панели расширения.

<div slot="header">
    <h3>{{acl.module_name}}</h3>
</div>

Не уверен, почему использование шаблона добавляет атрибут стиля в моем случае

<template v-slot:header>
    <div>
        <h3>{{acl.module_name}}</h3>
    </div>
</template>