Vue가 DOM 요소를 가져오고 속성을 설정하는 두 가지 방법

이 기사에서는 주로 Vue가 DOM 요소를 얻고 속성을 설정하는 두 가지 구현 방법을 제공합니다. 에디터가 꽤 좋다고 생각해서 지금 공유해서 참고용으로 올려보겠습니다. 편집자를 따라 살펴보겠습니다. 모두에게 도움이 되기를 바랍니다.

여기서 2가지 방법을 생각했습니다.

방법 1:

해당 요소에 직접 ID를 추가한 다음 document.getElementById("id");를 통해 ID를 얻은 다음 해당 속성이나 스타일을 설정합니다.

방법 2:

ref를 사용하여 해당 요소에 ref="name"을 추가한 다음 this.$refs.name을 사용하여 요소를 가져옵니다.

참고: 해당 요소를 가져오기 전에 마운트 후크를 사용하여 마운트해야 합니다. 그렇지 않으면 얻은 값이 비어 있습니다.

하위 구성 요소에 ID를 추가하고 사용자 정의 속성을 수정하면 해당 하위 구성 요소에 해당하는 외부 p에 직접 로드되며 하위 구성 요소의 원래 사용자 정의 속성 값은

하위 구성 요소에 ref를 추가한 다음 DOM 요소를 가져온 후 해당 사용자 정의 속성의 값을 변경하면 Vue에서 오류를 보고합니다.

Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "title"

관련 권장 사항:

html의 name 속성을 사용하세요. DOM 요소 가져오기

DOM 객체 가져오기 _javascript 기술의 여러 확장 및 약어

JavaScript를 사용하여 DOM 요소의 위치와 크기를 얻는 방법_기본 지식

위 내용은 Vue가 DOM 요소를 가져오고 속성을 설정하는 두 가지 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!