Почему nuxt ругается на тег form?

Question

[WebDev]

Получаю ошибку

[Vue warn]: The client-side rendered virtual DOM tree is not matching server-rendered content. This is likely caused by incorrect HTML markup, for example nesting block-level elements inside <p>, or missing <tbody>. Bailing hydration and performing full client-side render.

Методом тыка пришел к выводу, что ошибка вылетает, когда вставлен тег

<div class="dummy" :class="{visible: customServiceDummy}" @click="hideDummy">
            <div class="dummy-content" @click="closeCustomImagesList">
                <div @click="hideDummy" class="dummy-close-icon icon-close"></div>

                    <form class="custom-service-form" @submit.prevent="saveCustomService">
                    <!--Разметка внутри form-->
            </div>
</div>

Если из кода выше убрать тег form, но оставить все что внутри, то ошибки нет. В чем может быть дело?

Answer 1

[EldarKin]

Скорее всего он ругается на отдельные элементы внутри формы. Попробуй найти на какие элементы ругается (методом исключения) и оберни их в тег
<client-only></client-only>
В моем случае это был плагин @nuxtjs/vuetify, компоненты которого я использовал внутри формы, и для этого плагина пришлось ещё добавить опцию отключения ssr, при инициализации.