반응형
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.data
vue 컴포넌트 인스턴스가 아닌 옵션을 참조하고 있습니다.그렇기 때문에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
반응형
'itsource' 카테고리의 다른 글
뮤텍스 예/자습서? (0) | 2022.08.29 |
---|---|
char의 길이는 정확히 8비트입니까? (0) | 2022.08.29 |
store getter가 null 대신 옵서버 개체를 반환합니다. (0) | 2022.08.29 |
해시맵에 지정된 키를 사용하여 값을 갱신하려면 어떻게 해야 합니까? (0) | 2022.08.28 |
vuelidate를 사용하여 중첩된 개체를 검증할 때 오류 메시지를 vuetify로 표시 (0) | 2022.08.28 |