> 웹 프론트엔드 > JS 튜토리얼 > Vue에서는 먼저 데이터를 요청한 다음 DOM 공유를 렌더링합니다.

Vue에서는 먼저 데이터를 요청한 다음 DOM 공유를 렌더링합니다.

亚连
풀어 주다: 2018-05-29 16:59:35
원래의
2348명이 탐색했습니다.

이제 Vue에서 먼저 데이터를 요청한 다음 DOM을 렌더링하는 방법에 대한 기사를 공유하겠습니다. 이는 좋은 참고 가치가 있으며 모든 사람에게 도움이 되기를 바랍니다.

프로젝트에서 문제가 발생했습니다. 다음은 vue 템플릿의 코드입니다.

내 이전 작성 방법은

이 결과는 다음과 같습니다. dom, get DOM은 모두 정의되지 않았습니다. 즉, 검색되지 않습니다.

이유는 데이터 요청->dom 렌더링->dom 가져오기 순서로 실행되지 않기 때문입니다. 실제 실행 순서는 dom을 먼저 가져오는 것이며 이때 배열 옵션은 여전히 ​​비어 있습니다. for 루프는 dom이 렌더링되지 않아서 전혀 얻을 수 없었습니다(왜인지 모르겠습니다)

나중에 생성된 함수에 요청 데이터를 썼고, dom을 가져오는 작업을 함수가 탑재되었지만 dom을 가져오는 작업이 여전히 먼저 수행되었습니다.(실행 순서는 경고의 순서에 따라 결정됩니다.) 마침내 해결책을 찾았습니다. 콜백에서 nextTick을 사용해보세요. nextTick 콜백에~"

다른 사람의 대답은 "종속성 DOM이 반드시 존재해야 하는 상황이 있으면 Mounted(){this.$nextTick(() => { /* code */ })}” (이전에 시도한 적이 있는데 너무 잘 작동했는데 왜 그런지 모르겠습니다.) 이 두 가지 방법을 결합했는데 실제로는 주로 첫 번째 방법이고 작동한다는 것을 알았습니다. !

위 내용은 제가 여러분을 위해 정리한 내용입니다. 앞으로 도움이 되길 바랍니다.

관련 기사:

vue1 및 vue2를 기반으로 dom 요소를 얻는 방법

JS 메서드로 QR 코드를 생성하고 링크를 그림으로 변환

동적으로 데이터를 생성하고 삭제하는 Vue 메서드


위 내용은 Vue에서는 먼저 데이터를 요청한 다음 DOM 공유를 렌더링합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿