programing

Vue.js 컴포넌트의 랜덤 "data-v-*" 속성

prostudy 2022. 7. 5. 22:06
반응형

Vue.js 컴포넌트의 랜덤 "data-v-*" 속성

Vue.js를 사용해 실험한 결과, 내가 단일 파일 컴포넌트로 정의하고 커스텀 요소로 포함하는 컴포넌트의 모든 인스턴스가 다음과 같은 랜덤 해시 속성을 얻는 방법을 알게 되었습니다.data-v-58fd7087="". 구체적으로는:

  • 특정 컴포넌트의 모든 인스턴스의 모든 DOM 요소는 동일한 해시를 가져옵니다.
  • 해시는 라우터와 독립적으로 생성됩니다.
  • 콜간에 해시가 안정되어 있다.
  • 구성 요소의 이름 변경 간에 해시가 안정적입니다.
  • 해시가 디스크에 저장/생성되지 않았습니다.
  • 따라서 해시는 동적으로 생성됩니다.

Vue 설정의 일부인 Karma 또는 Webpack에 의해 생성될 수 있습니까?그렇지 않다면, 이것들은 나에게 놀라운 관찰입니다.다음 두 가지 질문으로 이어집니다.

  • 이 해시(아트리뷰트)는 언제 어떻게 생성됩니까?
  • 해시(속성)가 생성되는 이유는 무엇입니까?

Vue Loader와 함께 스코프 CSS를 사용하는 경우에도 이와 유사한 현상이 발생합니다.

scope css를 사용하여 다음과 같은 속성을 가지고 있습니다.data-v-4646bc3c그래서 그런 것 같아요.

이 기능을 사용하지 않으려면scoped속성을 설정할 수 있습니다.

<style scoped>
/* local styles */
</style>

사용하시는 경우vueify아무것도 변경하지 않고 빌드를 변경하는 이유가 궁금하다면 vueify를 사용하여process.env.NODE_ENV로 설정하다.'production'그렇지 않으면 새로운 핫 새로고침 코드가 생성됩니다.data-v-*모든 건물에 해쉬를 붙입니다.

언급URL : https://stackoverflow.com/questions/42701312/random-data-v-attribute-in-vue-js-components

반응형