현재 뷰를 이용해서 프론트쪽을 만들고 있습니다. 그런데 한가지 문제가 있는데 브라우저에서 새로고침 버튼을 누르면 소스코드인 대괄호 (장고 표기인 '{{ }}'와 겹쳐서 '[[ ]]'로 설정)표기가 잠깐씩 브라우저에 나타 납니다. 특히 v-if v-for를 주로 사용한 부분에서 나타납니다.

(이 스크린샷은 리프레시를 눌렀을때 잠시 뜨는 것을 캡쳐한 사진 입니다.)

<ol class="fileNames" style="list-style: none; padding-left:0px;">
                    <li v-for="(namecheck, index) in fileNamesWithCheck">
                        <div v-if="namecheck.fileName != 'default'" class="p-3 mb-2 bg-light text-dark">
                            <span>[[ namecheck.fileName ]]</span>
                            <button type="button" class="close" aria-label="Close">
                                <span v-if="namecheck.fileUploaded">upload완료</span>
                                <span v-else aria-hidden="true" v-on:click="remove_todo(index)">&times;</span>
                            </button>
                        </div>
                    </li>
                    <li v-for="(size, index) in fileSizeCheck">
                        <p v-if="size.sizeCheck">총 파일 크기: [[ returnedFileSize(fileSize) ]]</p>
                    </li>
</ol>

(v-if v-for을 사용한 html코드입니다.)

어떻게 하면 리프레시를 할때 소스코드가 잠깐씩 보이는걸 방지 할 수 있을까요? 만약 방법이 없다면 바닐라 js로 코드를 짜야하는건지 궁금합니다.