itsource

VueJS 데이터 속성을 초기 값으로 재설정

mycopycode 2022. 8. 29. 22:21
반응형

VueJS 데이터 속성을 초기 값으로 재설정

전달된 구성 요소를 통해 초기 데이터 속성을 제공하는 구성 요소가 있습니다.prop데이터 변수에 저장됩니다.

<component :propvar="true"></component>

data() {
  return {
    localvar: this.propvar,
    localvar2: true
  }
}

다음과 같은 방법으로 'reset' 버튼을 누르면 데이터 변수를 이 프로펠러 값으로 되돌릴 수 있습니다.

methods: {
  reset() {
    Object.assign(this.$data, this.$options.data());
  }
}

문제는 데이터 변수가undefined프로포트의 가치를 참조할 때this.options.data():

console.log(this.$options.data()); => Object {localvar: undefined, localvar2: true}

바이올린의 예

모든 데이터 속성을 리셋해야 하는 경우data()method는 다음과 같이 실행할 수 있습니다.

methods: {
  reset() {
    Object.assign(this.$data, this.$options.data.call(this));
  }
}

this변수this.$options.datavue 컴포넌트 인스턴스가 아닌 옵션을 참조하고 있습니다.그렇기 때문에localvar자산은undefined따라서 vue 인스턴스에서 호출하는 경우 다음 정보를 참조해야 합니다.this함수의 방법을 통해.


다만, 대부분의 경우, 전화하는 대신 직접 값을 할당합니다.Object.assign:

methods: {
  reset() {
    this.localvar = this.propvar;
  }
}

언급URL : https://stackoverflow.com/questions/43643325/resetting-vuejs-data-properties-to-initial-values

반응형