Синтаксис Vue отображается после загрузки страницы

Question

Я новичок в Vue.js.В настоящее время я использую Vue.js поверх ядра asp.net.

Я заметил, что за 99% времени страница обрабатывается до визуализации синтаксиса Vue.js.Как я могу предотвратить это?

Например

Когда сначала загружается страница, я вижу

<ol>
<li v-for="u in subscribers">{{ u.name }} - {{u.email}}</li>
</ol>

А затем через долю секундыЯ вижу

<ol>
<li>John - john@domain.com</li>
<li>John1 - joh1n@domain.com</li>
</ol>

Answer 1

Поскольку шаблон написан внутри HTML-кода страницы, он всегда будет сначала отображаться браузером при загрузке страницы.Обычно компоненты Vue включают шаблон, который используется для визуализации данных, и этого не произойдет.

Вы можете взять шаблон, написанный на странице, и добавить его в компонент Vue , чтобы он использовал его для рендеринга, а не для содержимого страницы.Самый простой способ - просто добавить шаблон в качестве параметра в компонент Vue, но позже может быть лучше использовать отдельные файлы шаблонов или Single File Components , что может потребовать немного больше работы.