Vue.js - 비반응 데이터를 하위 컴포넌트에 전달하는 방법

Vue.js - 비반응 데이터를 하위 컴포넌트에 전달하는 방법

Propos를 통해 자 컴포넌트에 데이터를 전달할 수 있습니다.단방향 데이터 흐름 모드에서는 반응합니다.상위 구성 요소에서 데이터 값이 변경되면 다음 작업에도 영향을 미칩니다(업데이트).props자 컴포넌트에 있습니다.

내 경우 상위 구성 요소의 데이터가 변경되더라도 Child 구성 요소의 특정 소품에 대한 업데이트를 받고 싶지 않습니다.Child 컴포넌트는 데이터 표시만 담당하기 때문입니다.그러나 상위 구성 요소의 데이터는 여전히 상위 범위에서 반응해야 합니다.

Json처럼 사용할 것을 제안하는 포럼 기사를 읽은 적이 있습니다.좀 지저분한 방법인 것 같고 내 경우 데이터는 하나뿐입니다.string.

그런 해결책을 얻을 수 있는 방법이 있을까요?

하위 구성요소의 생성된 후크에 반응형 소품을 복사할 수 있습니다.복사는 반응하지 않습니다.

export default {
  props: {
    reactive: Object
  },
  data: () => ({
    nonreactive: null
  }),
  created() {
    this.nonreactive = Object.assign({}, this.reactive)
  }
}

주의: 사후 대응형 프로포트를 복사하는 방법은 데이터 유형에 따라 다르며, 표시된 방식은 개체에 대해 작동합니다.

아마 당신은 이것을 확인할 수 있을 것이다.

VueJ는 한 번 요소로 렌더링합니다.

사용하다v-once자 컴포넌트

하위 구성 요소에서 소품을 데이터 속성으로 사용합니다.바이올린 링크를 참조하십시오.

여기에 링크하다

Vue.component('greeting', {
  props: ['user'],
  data:function(){
    return {
      newuser:this.user
    }
  },
  template: '<h1>hi {{ newuser }}</h1>'
});

언급URL : https://stackoverflow.com/questions/52251957/vue-js-how-to-pass-non-reactive-data-to-child-components