vue 계산된 속성을 한 번만 실행하는 방법

vue 계산된 속성을 한 번만 실행하는 방법

나는 배열을 채우는 계산된 속성이 있지만, 그 후에 이 배열로 작업할 것이다. 그리고 배열이 비어 있으면 빈 상태로 남기를 원한다. (계산된 속성은 배열을 다시 채우지 않기 위해 말한 것이다.)내가 어떻게 그럴 수 있을까?나는 게터를 통해 Vuex 스토어에서 데이터를 가져오는 중이기 때문에 계산된 속성을 사용하고 있다.문제가 되는 재산은 다음과 같다.

populateAvailableMachines() {
  Object.values(this.userData).forEach(user => {
    if (this.$auth.user().id == user.id) {
      if (this.availableMachines.length == 0) {
        Object.keys(user.machine).forEach(key => {
          this.availableMachines.push(user.machine[key].machine_name);
        });
      }
    }
  });
},

푸시/분할하는 방법은 다음과 같다.

addMachineTab(item) {
  let index = this.availableMachines.indexOf(item);
  this.selectedMachines.push(this.availableMachines.splice(index, 1));
},

일단 사용 가능한 시스템 어레이의 모든 값이 선택한 시스템 어레이로 이동되면 빈 사용 가능한 시스템 어레이를 채우는 계산된 속성을 다시 실행하지 마십시오.

만드는 것은 권장하지 않는다.computed특성은 다음과 같은 부작용을 낳는다.data돌연변이를 일으키는이사하는 것이 좋을 것이다.populateAvailableMachines메소드에 대한 기능 및 한 번만 호출(예: 장착된 경우)

대신 감시자를 사용하십시오.

watch: {
  userData: {
    handler: function (val, oldVal) {
      if(this.availableMachines.length > 0){
        // put your populate logic here
      }
    },
    deep: true
  }
},

게다가 데이터를 초기화해야 할 수도 있다.userData그리고availableMachines)인created또는mounted낚싯바늘을 달다

참조URL: https://stackoverflow.com/questions/57606027/how-to-run-a-vue-computed-property-only-once