호출하지 않고 실행 중인 계산 함수

호출하지 않고 실행 중인 계산 함수

계산된 함수를 통해 데이터 속성에 어레이를 설정하고 있으며, 정상적으로 작동합니다.근데 어디에도 전화하지 않으면 어떻게 가능하죠?console.log를 기능에서 추가하려고 해도 아무것도 인쇄되지 않지만 데이터는 여전히 설정되어 있습니다.어떻게 할 수 있을까요?

데이터:

 data() {
    return {
      projects: []
    };
  },

계산 결과:

computed: {
  loadedProjects() {
    console.log("Hello there")
    this.projects = this.$store.getters.loadedProjects
   }
},

전화를 걸지 않고 console.log를 인쇄하여 데이터를 설정하기 전에 실행 중인지(이유를 알 수 없음)에 따라 실행이 되지 않을 수 없습니다.뭔가 명확해졌나요?감사합니다.

계산 도구와 방법을 혼동하고 있군요.vue instace의 데이터 값을 설정하는 위와 같은 메서드를 사용하려면 계산 프로펠이 아닌 메서드를 사용해야 합니다.

 data() {
    return {
      projects: []
    };
  },
 methods: {
   loadProjects() {
     console.log("Hello there")
     this.projects = this.$store.getters.loadedProjects
   }
 }

이렇게 하면 가치가 높아집니다.this.$store.getters.loadedProjects 로컬 프로젝트 값에 할당합니다.Vuex를 사용 중이므로 로컬 참조가 스토어 가치에 대한 업데이트와 동기화되도록 해야 합니다.이것이 컴퓨터 소품들이 유용하게 쓰이는 부분이다.사실, 이 제품은 필요 없습니다.projects데이터에는 전혀 없습니다.계산 도구만 있으면 됩니다.

computed: {
  projects() {
    return this.$store.getters.loadedProjects
   }
},

이제 vue는 스토어가 업데이트될 때마다 프로젝트에 대한 로컬 참조를 업데이트합니다.그런 다음 템플릿의 일반 값과 동일하게 사용할 수 있습니다.예를들면

<template>
  <div v-for='item in projects' :key='item.uuid'>
    {{item.name}}
  </div>
</template>

예를 들어 값을 직접 할당하는 등 계산된 속성에서 부작용을 피하십시오. 계산된 값은 항상 값 자체를 반환해야 합니다.이는 기존 데이터에 필터를 적용하는 것일 수 있습니다.

computed: {
  completedProjects() {
    return this.$store.getters.loadedProjects.filter(x => x.projectCompleted)
  },
  projectIds() {
    return this.$store.getters.loadedProjects.map(x => x.uuid)
  }
}

무슨 말인지 아시겠죠?vuex 상태를 컴포넌트로 이행하기 위한 베스트 프랙티스에 대한 자세한 내용은 https://vuex.vuejs.org/guide/state.html를 참조하십시오.

계산 소품 문서: https://vuejs.org/v2/guide/computed.html

계산된 속성 및 메서드에 대한 Vue 문서를 확인해야 하며 계산된 속성 getter https://vuejs.org/v2/guide/computed.html#Computed-Caching-vs-Methods 내에서 메서드를 실행해서는 안 됩니다.

계산된 속성 대신 메서드와 동일한 함수를 정의할 수 있습니다.최종 결과에서, 두 가지 접근법은 확실히 동일합니다.그러나 계산된 속성은 반응 종속성에 따라 캐시된다는 점이 다릅니다.계산된 속성은 반응 종속성 중 일부가 변경된 경우에만 재평가됩니다.

언급URL : https://stackoverflow.com/questions/57622697/computed-function-running-without-to-call-it